箭头函数和 `this`

Question

我正在粘贴来自 mozilla 文档的片段。

箭头函数不会创建自己的 this，而是使用封闭执行上下文的 this 值。因此，在以下代码中，传递给 setInterval 的函数中的 this 与封闭函数中的 this 具有相同的值：

function Person(){
  this.age = 0;

  setInterval(() => {
    this.age++; // |this| properly refers to the person object
  }, 1000);
}
var p = new Person();

我的困惑是当上面的代码被执行时，setInterval 函数将被它的实现所取代，匿名函数作为参数传递。

setinterval(){

-------some code for repeating the function passed as argument

the function itself



  () => {
 this.age++;   //line 00
    }
    -----
    some code 

    }

第 00 行：这里不会指向匿名函数，因为使用了箭头函数，而是指向封闭的执行上下文。据我了解，这里的封闭执行上下文是 setInterval 函数，但没有定义年龄属性。我知道我错了，因为年龄指向人对象，因为它运行很好。

Answer 1

函数创建的位置，而不是调用的位置，即enclosing context。您的函数是在 function Person 中创建的，因此此函数是 arrow function.

的封闭上下文

您只创建一个 arrow function 并将其传递给 setInterval，它不会在 setInterval 的定义中创建。这个

function Person(){
  this.age = 0;

  setInterval(() => {
    this.age++;
  }, 1000);
}

相当于这个。在这里您可以看到 func 的封闭上下文是 Person。

function Person(){
   this.age = 0;

   var func = () => {
       this.age++;
   };

   setInterval(func, 1000);
}

箭头函数和 `this`

Arrow function and `this`

javascript

ecmascript-6

arrow-functions