This 指向

1、在函数体中，非显式或隐式地简单调用函数时，在严格模式下，函数内的this指向 underfined，在非严格模式下，函数内的this指向 全局对象window/global

var a='ABC'
function t1(){
    console.log(this.a)
}
t1();// 输出ABC  this指向 window

'use strict';
function t2(){
    console.log(this)
}
t2();// undefined

2、使用new 调用构造函数时，构造函数内的this 指向新创建的对象

function f1(){
    this.a='ABC'
}
var obj = new f1();
console.log(obj.a); // ABC

function f2(){
    this.a='DEF'
    return {a:'GHI'};
}
var obj2 = new f2();
console.log(obj2.a); // GHI
function f3(){
    this.a='JKL'
    return;
}
var obj3 = new f3();
console.log(obj3.a); // JKL

如果构造函数中返回一个值，若返回的是一个对象，this 指向返回的对象；否则this指向原创建实例。

3、通过 出call/apply/bind方法显式调用函数时，函数内this 指向指定的对象（第一个参数）

var obj ={
    a:'ABC',
    f1:function(c,d){
        console.log(this.a)
    }
}
var obj2 ={
    a:'DEF'
}
obj.f1();// ABC
obj.f1.call(obj2,'arg1','arg2');// DEF
obj.f1.apply(obj2,['arg1','arg2']);// DEF
obj.f1.bind(obj2,'arg1','arg2')();// DEF

4、通过上下文对象A调用函数时，函数内this指向对象A；

var a='ABC'
var obj ={
    a:'DEF',
    f1:function(){
        console.log(this.a)
    }
}
obj.f1(); // DEF

另外，但存在复杂的多层调用关系时，this指向最后调用函数的对象。

5、箭头函数的this的指向由它的外层作用域来决定的（指向外层作用域的this）

var obj ={
    a:'ABC',
    f1:function(){
        setTimeout(() =>{
            console.log(this.a)
        },1);
        return {
            a:'DEF',
            f3:function(){
                setTimeout(() =>{
                    console.log(this.a)
                },1);
            }
        }
    },
    f2:function(){
        setTimeout(function(){
            console.log(this.a)
        },1);
    },
    
}
var f1Obj =obj.f1(); // ABC
obj.f2(); // undefined
f1Obj.f3(); // DEF