ES6 箭头回调如何确定“this”是什么？ [复制]答案

【问题标题】：How do ES6 arrow callbacks determine what 'this' is? [duplicate]ES6 箭头回调如何确定“this”是什么？ [复制]
【发布时间】：2017-08-23 00:52:01
【问题描述】：

var test = {
    literalLogger: function() {
        console.log('literal')
        console.log('this: ', this)
    },
    arrowLogger: () => {
        console.log()
        console.log('this: ', this)
    },
    nestedArrowLogger() {
        this.arrowLogger();
    }
}

第一个函数将 this 记录为对象。第二个函数将其记录为窗口。第三个函数将其记录为窗口。为什么？

【问题讨论】：

你所有的函数都属于一个名为“test”的对象。所以在你的第一个例子中，它确实会返回test对象。箭头函数捕获范围，iow：它们不会将您的 this 更改为指向 test，而是在它之前的上下文，在本例中为 window，.. 您的第三个示例实际上是在重复第二个。
@Keith 这不太对。这些函数当然附加到test 对象，但这并不能保证函数中的this 将是test。这完全取决于各个函数是如何调用的。你最后的评论有错字吗？第三个类似于第一个，而不是第二个。
为什么这被否决了？似乎是一个有效的问题。也嗨@loganfsmyth
见MDN Arrow Functions。 "...不绑定自己的this"
@loganfsmyth 实际上，这取决于函数的调用方式。在这个例子中，我假设它们是从测试中调用的。*。例如。 test.literalLogger()，当然 bind & call 可以改变事情。如果从 test.* 调用，我的意思是 3rd 与 2nd 相同，因为 2nd 已经获得了它的上下文范围。

标签： javascript ecmascript-6 arrow-functions

【解决方案1】：

胖箭头函数捕获this 关键字相对于它在其声明的上下文中的内容（第二个this 是窗口）。

至于第三个，可能是因为对象字面量中的x() 是x: function() 的简写？

【讨论】：

哦，在这种情况下有点像闭包？他们记得“this”是什么，并且不会像使用文字函数那样变形？
是的，这就是一般的想法