JS中感觉this的指向是多变的。这里进行一下总结
个人感觉this的指向大致分为以下几类
1、作为普通函数的调用。
例如:
var x = 1;
function test(){
console.log(this.x);
}
test(); //这里打印1
一般这种情况我个人为了加深理解都会做一步变形。把所有的函数调用加上前缀比如test()就是window.test()。理解为this指向调用该函数的对象。
2、作为对象的方法调用。
例如:
var y = 1;
var obj = {
y: 2,
output:function(){
console.log(this.y);
}
}
// 第一种打印
console.log(obj.output()); // 这里打印2
// 第二种打印
var assignmentobj = obj.output;
console.log(assignmentobj()); //这里打印1
这里我个人是这么理解的obj.output(),方法指向调用者是this也是指向obj的。所以打印 obj的y 属性。也就是2
而对于assignmentobj()还是理解为window.assignmentobj();所以这里的this指向window。打印obj的y属性。 也就是1
3、作为构造函数里面的指向
例如:
var z = 1;
function Objtest(){
this.z = 2;
this.outputtest = function(){
console.log(this.z);
}
}
var aaa = new Objtest();
var bbb = new Objtest();
aaa.z = 3;
console.log(aaa.outputtest()); //打印3
console.log(bbb.outputtest()); //打印2
个人理解这里的this是指向实例本身的,所以打印实例本身的属性,如果本身的属性被修改。就会打印修改后的属性,总之,指向实例化本身。
4.apply、call、bind处理之后的this指向
例如:
var p = 100;
var obj1 = {
p:200,
testoutput:function(){
console.log(this.p)
}
}
var obj2 = {
p:300
}
obj1.testoutput.apply(obj2); //打印300
obj1.testoutput.apply(); //打印100
obj1.testoutput.call(obj2); //打印300
obj1.testoutput.call(obj2); //打印100
obj1.testoutput.bind(obj2)(); //打印300
obj1.testoutput.bind()(); //打印100
个人理解这里的this指向apply、call、bind传入的第一个参数。假如为空则指向window。bind只是绑定,要执行的话需要再次调用所以bind()后面再加一个()表示调用这个方法。
JS中this关键字的指向
最新推荐文章于 2022-06-22 19:28:07 发布