首页 > 解决方案 > 这。引用 Object 而不是 Window-Object

问题描述

我有一个如下所示的对象。

在第 6 行,我写了console.log(this.title, elem).

现在根据我了解到的情况。-Keyword,this.title这里不应该引用当前的Object,而是全局的Window-Object。现在与我的知识相反,this.title似乎正确引用了视频对象的属性。

const video = {
    title: "a",
    tags: ["a", "b", "c", "d"],
    showTags() {
        this.tags.forEach(elem => {
            console.log(this.title + ": ", elem)
        });
    }
}
video.showTags();

这是浏览器显示的内容:

a:  a
a:  b
a:  c

我想,既然console.log(this.title, elem)在回调函数内部,就会引用全局窗口对象。这篇文章证实了我this.title应该实际引用全局对象的概念。

有人可以解释一下吗?

标签: javascriptreferencethiswindow-object

解决方案


箭头函数在词法上绑定了它们的上下文,因此 this 实际上是指原始上下文。由于您在Arrow这里使用函数,this因此 forEach() 方法内部的值指向声明它的词法环境。那是在showTags()方法内部,所以它与this的值相同showTags()

如果此处未使用箭头函数,则 的值为thiswindow,如下面的代码片段所示:

const video = {
    title: "a",
    tags: ["a", "b", "c", "d"],
    showTags() {
        this.tags.forEach(function(elem ) {
            console.log(this.title, elem)
        });
    }
}
video.showTags();


推荐阅读