请问这个this的指向是怎么回事？

function Page(arg){
this.method = arg.method;
}
var PageObj = new Page({
method: {
watch: () => console.log(this)
}
});
PageObj.method.watch();

请问为什么this的指向是undefined？
对于这种情况，可不可以理解为传递一个函数作为参数，但是这里的watch是一个箭头函数，箭头函数中this的指向不应该是定义的时候就绑定到最近一层普通函数的this吗？this就该指向Page?? 我晕了， 搞不懂了？请指点一下

function Page(method){
this.method = method;
}
var PageObj = new Page(
() => console.log(this)
)
PageObj.method();

然后this的指向也是undefined

回答

MDN：
请问这个this的指向是怎么回事？
https://developer.mozilla.org...

JavaScript 采用的是 词法作用域，所以对于上述两个例子中的箭头函数来说，它的作用域链应该是：[GlobalContext, 自身的 Context]。

所以最后的函数调用：非严格模式下的话 this 会隐式指向全局对象，即 Window。严格模式下为 undefined。

更正：

一：试了一下非 ES6 模块下，不管是否为严格模式，上面两段代码的输出结果均为 Window。查到了一些相关的内容：

  1. Arrow function expressions - MDN 有一节 Relation with strict mode。

  2. https://stackoverflow.com/que...

  3. http://www.ecma-international... 中的 9.2 关于 ThisMode 的解释

二：使用 ES6 模块（ES6 的模块自动采用严格模式），顶层的this指向undefined。输出结果都是 undefined。

箭头函数中this的指向不应该是定义的时候就绑定到最近一层普通函数的this吗，可以这么理解，到你的例子中来，你的箭头函数外层存在函数体吗？并不存在啊，new Page是函数调用，这和函数声明完全不是一回事。

箭头函数中this的指向不应该是定义的时候就绑定到最近一层普通函数的this吗？

不是的。准确点描述应该是：箭头函数中this的指向是定义的时候就绑定到定义时所在的执行上下文环境的this。

即上面的代码相当于：

var that = this;
var PageObj = new Page({
    method: {
        watch: () => console.log(that)
    }
});

箭头函数不会创建自己的 this ,它只会从自己的作用域链的上一层继承 this 。来自MDN

以上是 请问这个this的指向是怎么回事？ 的全部内容， 来源链接： utcz.com/a/69139.html

回到顶部