谈谈JavaScript中的this

普通函数中的this

1、函数直接调用

function get(content){
    console.log(content)
}
get('hello world')
// 相当于下面这句
get.call(window, 'hello world')

2、在对象中调用函数

var person = {
    name: '张三',
    run: function(time){
        console.log(`${this.name}在跑步，最多就跑${time}min`)
    }
}
person.run(30)
// 相当于执行了下面这句
person.run.call(person, 30)

小练习

var name = 222
var a = {
    name:111,
    say:function(){
        console.log(this.name);
    }
}
var fun = a.say
fun()   
a.say() 

var b = {
    name:333,
    say:function(fun){
        fun()
    }
}
b.say(a.say)
b.say = a.say
b.say()  

输出的结果：
fun.call(window)  222
a.say.call(a)            111
b.say(a.say.call(window))  222
b.say.call(b)     333

箭头函数中的this

箭头函数中的this是在函数定义的时候就被创建的，它根本就没有自己的this，所以箭头函数不 能作为构造函数

综上所述：箭头函数的this是 继承父执行上下文中的this

var x = 111
var obj = {
    x: 222,
    fun: ()=>{
        console.log(this.x)
    }
}
/*
    fun箭头函数和obj中的x是平级的，它们的父级是obj，而obj所处的环境是window
    所以这里的this所指向的就是window，也就是 111
*/

var obj = {
    birth: 1990,
    getAge: function(){
        var b = this.birth
        var fn = () => new Date().getFullYear() - this.birth
        return fn()
    }
}
obj.getAge()

/*
    这里的fn箭头函数和b是同级的，它们的父级是getAge函数，而getAge函数所处的环境是obj对象
    所以，这里的this指向的是obj
*/

以上就是我对JavaScript中this的理解，希望我有理解不对的地方大家可以指出来。