四大绑定规则
-
new绑定:
var a = 1; function Person(a){ this.a = a; console.log(this.a); } const p = new Person(2); // 2 console.log(p.a); // 2
-
显式绑定:
call
,apply
,bind
var a = 'window'; var obj1 = { a:1, test:function(){ console.log(this.a); } }; var obj2 = { a:2, }; obj1.test(); // 1 obj1.test.call(obj2); // 2
-
隐式绑定:
var a = 'window'; var obj = { a:1, test:function(){ console.log(this.a); } }; obj.test(); // 1
注意:定时器和延时器的
this
指向window
;var a = 'window'; setTimeout(function() { console.log(this.a); }, 2000)
2秒后打印
window
,setTimeout
的执行其实是省略了window.setTimeout
;但是回调函数是箭头函数那么this
指向就是setTimeout
执行所在的作用域,如下:const obj1 = { a: 1, test(){ setTimeout(function () { console.log(this.a); }, 1000) } } obj1.test(); // undefined const obj2 = { a: 2, test() { setTimeout(() => { console.log(this.a); }, 1000); }, }; obj2.test(); // 2
-
默认绑定:
// 在非严格模式下 var a = 'window'; function test() { console.log(this.a); } test(); // window // 在严格模式下 var b = 'window'; function testNext() { console.log(this.b); } testNext(); // undefined
非严格模式下
this
指向window
,严格模式下this
指向一个空对象({}
);
总结: 四个规则优先级为:new => 显式 => 隐式 => 默认,函数this
的确定是函数谁调用this
就指向谁;注意一点,箭头函数是独立于这四个规则之外的;