javascript - 这。引用 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
应该实际引用全局对象的概念。
有人可以解释一下吗?
解决方案
箭头函数在词法上绑定了它们的上下文,因此 this 实际上是指原始上下文。由于您在Arrow
这里使用函数,this
因此 forEach() 方法内部的值指向声明它的词法环境。那是在showTags()
方法内部,所以它与this
的值相同showTags()
。
如果此处未使用箭头函数,则 的值为this
window,如下面的代码片段所示:
const video = {
title: "a",
tags: ["a", "b", "c", "d"],
showTags() {
this.tags.forEach(function(elem ) {
console.log(this.title, elem)
});
}
}
video.showTags();
推荐阅读
- python - 在 django 中获取与一个 id 对应的所有图像
- android - 如何从 Android 应用程序进行呼叫转发
- apache-kafka - KTable 无法从物化视图中获取数据
- android - 如何在for循环内同步执行firebase函数?
- c++ - SFML 视图 setCenter 与旋转
- java - 列表视图不使用 Firebase 填充
- amazon-web-services - AWS SES 电子邮件接收 - 550 邮箱未找到
- asp.net - 如何在我的 ASP.NET MVC 应用程序中遍历 ParseObject 集合?
- html - 通过括号更改字体颜色
- vue.js - Vue中通过data属性传递函数引用