菜鸟看前端（this指向）

this指向

1. 在浏览器里，在全局范围内this 指向window对象；
2. 在函数中，this永远指向最后调用他的那个对象；
3. 构造函数和class类中，this指向new出来的那个实例化的对象；
4. call、apply、bind中的this被强绑定在指定的那个对象上；
5. 箭头函数中this比较特殊,箭头函数this为父级的上下文，不是调用时的this.要知道前四种方式,都是调用时确定,也就是动态的,而箭头函数的this指向是静态的,声明的时候就确定了下来，不能修改this指向

call（）方法和apply（）方法的作用相同：改变this指向。

call（）：第一个参数是this改变后的this指向，在使用call（）方法时，传递给函数的参数必须逐个列举出来。
apply（）：第一个参数是this改变后的this指向，传递给函数的是参数数组

// 普通函数中this指向window
function fun() {
    console.log(this) // window
}

fun()
--------------------------------------------------------
// call apply bind中调用， this指向被传入的对象
function fun() {
    console.log(this) // {a:100}
}
fun.call({
    a: 100
}) // call改变this指向
----------------------------------------------------------
// call apply bind中调用， this指向被传入的对象
function fun() {
    console.log(this) // {a:100}
}

// bind改变this指向 返回一个新函数
const fun1 = fun.bind({
    a: 100
})
fun1()

----------------------------------------------------------

// 对象中的this指向
var obj = {
    name:'小高',
    say(){
        // 对象方法中调用，this指向当前对象
        console.log(this) // this指向对象本身
    },
    run(){
        setTimeout(function(){
            console.log(this) // this指向window
        },1000)
    },
    sleep(){
        // 箭头函数，this就是父级上下文中的this
        setTimeout(()=>{
            console.log(this)  // this指向对象本身
        },1000)
    },

}

obj.say() // 这里的this指向对象本身，对象方法中的this，指向当前对象（因为当前对象执行了方法）
obj.run() //setTimeout函数中的this,相当于普通函数中的this,因为setTimeout触发的函数执行，并不是外部对象执行的。
obj.sleep() // setTimeout中函数是箭头函数，this为当前对象。因为箭头函数中的this始终是父级上下文中的this.