一句话记住js箭头函数的this

阮一峰老师在他的文章中说,箭头函数的this就是定义时所在的对象,然后我们的小白同学很Happy的写下了如下代码:

var obj={
    num:1,
    counter:()=>this.num++
}
obj.counter();
console.log(obj.num)

他期望的结果是2,然而结果始终是1,问题出现在哪里呢?

不像其它oop语言,所谓对象就是类的实例,在于JS中对于对象没有一个统一标准的表述,我们大多数开发人员理解的对象一般有两种,一种是new SomeFuction()创建的,二是用字面量方法创建(文章开头的方式),而阮一峰老师文章中所指的对象是函数!!下面截图是他的观点。

按阮一峰老师举了很多例子来说this的作用域,如果你按照上面截图第一条去记的话,很容易出错,我把箭头函数的this重新总结了一下,如果你是懒人,只需要记住这一句话就好了:不管在什么情况下,箭头函数的this跟外层function的this一致,外层function的this指向谁,箭头函数的this就指向谁,如果外层不是function则指向window。

var obj={
    id:123,
    testFun:function(){
        var a= ()=>console.log(this.id)
        a();
    }
}
//testFun的this指的是obj,则箭头函数的this指向obj。
obj.testFun()  
//testFun的this指向window,箭头函数的this指向window。
obj.testFun.apply(null) 

发布于 2018-07-04