箭头用作对象方法

2018-06-11 11:47:56

我有一个问题要了解这箭功能。

我读了很多答案，例如：ES6对象中的方法：在这个描述中使用箭头函数和解释链接github和所有人都说这应该绑定到Window，但是当我检查这些例子时，我看到了未定义的，如果你们任何人知道为什么？

 var foo = {
     bar: () => console.log(this)  // lexical this is window or something else
 }
 foo.bar()

我使用babel来编译代码：

var foo = {
        bar: function bar() {
            return console.log(undefined);
        }
}

babel版本是：

“babel-core”：“^ 6.21.0”，

“babel-loader”：“^ 6.2.10”，

“babel-preset-es2015”：“^ 6.18.0”，

“babel-preset-stage-2”：“^ 6.18.0”，

但词汇这不是窗口只有undefined，为什么？

看起来你正在使用带有ES风格模块的webpack。模块内部的代码不具有隐式访问全局范围的权限。也就是说， this模块内部没有绑定任何东西。 Webpack显然将全局this引用替换成undefined这样任何全局上下文都不会泄露，即使它是由环境定义的。

如果您尝试在浏览器控制台中执行console.log("this: " + (() => this)()) ，您将看到this确实是window 。

那么，窗口不是JavaScript标准的一部分。由于babel不知道你的脚本运行的上下文，它只会使用undefined 。

例如，在nodejs中，全局范围将是global 。
当您在浏览器中执行代码时， window通常是全局范围。

链接地址: http://www.djcxy.com/p/32953.html