Question

我原以为console.log(myCounting.value);实际上会打印7，因为add方法被调用了两次（请参阅注释）。但它会打印6。这是因为范围？意味着使用myCounting.add调用'invoking'函数不会更改值，因为它的范围不同？有人可以解释，因为我正在学习范围。谢谢!!

function Counting(){
  this.value = 5;
}

Counting.prototype.add = function(){
  this.value++;
}

var myCounting = new Counting();
myCounting.add();   // invoked once

function invoking(funcs){
  funcs();
}

invoking(myCounting.add); //invoked twice
console.log(myCounting.value);

Answer 1

它与范围没有太大关系（除了函数创建范围可能？）。它与this的工作方式有关。

this的值取决于函数的调用方式。可以通过几种方式调用函数，每种方法都可以为this生成不同的值。在您的示例中，myCounting.add()和func()是调用函数的不同方式，导致this的值不同，因此this.value++将应用于两个不同的对象。< / p>

有关详细信息，请参阅How does the “this” keyword work?和How to access the correct this / context inside a callback?。

Answer 2

不幸的是，在Javascript中，this的值根据调用函数的方式/位置进行不同的评估：

在你的第一个例子中：

myCounting.add()

this指的是add函数的调用对象，在本例中是您的myCounting实例，正如您所期望的那样。

在你的第二个例子中：

invoking(myCounting.add)

这里，add绑定到顶级window对象（如果从浏览器中调用），因为它是从顶级范围调用的。因此，this实际上是全局窗口对象。

结果与您直接从浏览器控制台调用this.value++的结果相同。由于this.value为undefined，this.value++的结果为（无意义）NaN。

功能/对象的范围

2 个答案: