java在事件中的this_js中的this指向

任何一门语言中，相信this的指向问题都是一个重点，js也不例外。

js中的作用域分为全局作用域和局部作用域，在全局作用域中，this指向的是他的全局对象window，如下

在全局中打印this：console.log(this);

输出：Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, parent: Window, …}

下面看一下this在局部作用域(函数)中的指向

在函数中，this的指向大致分为四种：

一、在普通函数中this指向window：

var name = "小明";functionf() {var name = "小红";

console.log(this.name);

}

f();

输出：小明

匿名函数的this也指向的是window

var setname = "老王";functionf() {

(function() {var setname = "小王";

console.log(this,this.setname);

})();

}

f();

输出：Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, parent: Window, …}

"老王"

二、当函数作为方法调用时

var name = "老李";var obj ={

name:"小李",

getName:function() {

console.log(this.name);

}

};

obj.getName();

此时getName方法中的this指向的是调用它的对象，即obj，而不是window

三、以构造函数调用

functionPerson(name) {this.name =name;this.play =function() {

console.log(this.name+"正在打篮球");

}

}var sub = new Person("科比");var sub2 = new Person("韦德");

console.log(sub.play(),sub2.play());

四、在事件函数中的this指向的是当前事件源，也就是DOM对象

var btn =document.querySelector("#btn");

btn.addEventListener("click",function() {

console.log(this);

})

使用call()，apply()，bind()，方法可以强制修改this的指向，call和apply方法修改以后会立即执行，而bind()方法会返回一个新对象，

总结一下，this永远指向函数运行时所在的上下文对象，而不是函数被创建时所在的上下文对象