1.this 全局作用域下默认指向window
2. 函数的独立调用 this 指向window
3. 被嵌套函数独立调用时 this指向window
1 let obj = { 2 a:20, 3 foo:function(){ 4 function test(){ 5 console.log(this) 6 }
test() 7 } 8 } 9 obj.foo();
4.自执行函数 this指向window
1 function foo () { 2 (function test(){ 3 console.log(this); 4 })(); 5 }; 6 7 let obj = { 8 a: 20, 9 foo:foo 10 } 11 obj.foo();
如果想访问obj的作用域
function foo () { // console.log(this) (function test(that){ console.log(that.a); })(this); }; let obj = { a: 20, foo:foo } obj.foo();
5.闭包中this指向window.
let objs = { a: 20, foo: function(){ let c = this.a; return function fn() { console.log(this) return c; } } } let fns = objs.foo(); fns()
隐试绑定:
1.当函数当做对象的方法被调用的时候this指向函数的直接对象「"点"前边的对象」
function foo(){ console.log(this) } let obj = { a: 20, foo: foo, obj1: { a: 2, foo:foo } } obj.foo(); obj.obj1.foo()
隐试绑定丢失 1 函数被赋值给了变量再调用 2.当函数被作为参数传递 3.内置函数 4.间接调用 都会导致this指向的丢失
let a = 2; function foo(){ console.log(this.a); //2 obj.foo()被赋值给了bar bar和obj没有关系造成了隐试绑定丢失 this指向window } let obj = { a: 20, foo: foo, obj1: { a: 2, foo:foo } } var bar = obj.foo; bar();
隐试绑定丢失 2 函数被当作参数传递的时候 会造成隐试丢失.
setTimeout this指向window 是因为隐试丢失setInterval 同
let time = () =>{ console.log(this); } let obj = { a: 20, fun: time } setTimeout(obj.fun,2000)
间接调用
//间接调用 function fun (){ console.log(this); } let obj = { a: 20, fn: fun } let p = { a: 1 }; obj.fn(); //隐试调用 函数被当作对象的方法调用 this指向该函数的对象 obj (p.foo = obj.fn)(); //隐试丢失 间接调用 被赋值给了一个变量且立即执行 this指向window let b = obj.fn; b()//this指向window 函数被赋值给了一个变量去调用
p.fn = obj.fn;
p.fn() //this 指向p
显式绑定
//显式调用 call apply bind 改变this指向 function fn(){ console.log(this) } let obj = { a: 20 } fn(); //window // fn.call(obj) //obj // fn.apply(obj) //改变为 obj fn.bind(obj)() //this 预设
数组迭代遍历的方法第二个参数也可以改变this指向
let arr = [1, 2, 3, 4]; let obj = { a: 2 } arr.forEach(function(el){ console.log(this, el) },obj) //第二个参数显式绑定了this为obj
箭头函数 箭头函数当作方法被调用的时候 this指向window
let car = { speed: 60, run: ()=>{ console.log(this); //window } } car.run()