匿名闭包函数内部的“‘this”

Question

(function(value) {
    this.value = value;
    $('.some-elements').each(function(elt){
        elt.innerHTML = this.value;        // possibly undefined (Why?)
    });
})(2);

有人能解释一下上面代码中'this‘的值吗？

我的理解是：

this.value = value // Line 2 -这里指的是全局对象elt.innerHTML = this.value; // line 4 -为什么这“可能”是未定义的。请解释一下。

编辑:顺便说一下，我已经彻底阅读了这篇( How does the "this" keyword work? )帖子中关于“this”的解释(上面的代码就是从这里获得的)

Answer 1

JS解释器用来确定this的基本算法如下。

1. 当函数通过其特殊的call和apply方法调用时，this是call或bind的第一个参数。从通过其apply方法创建的绑定函数调用函数时，obj.method(params)是函数作为方法调用的this-
2. 参数，然后this是从中获取方法的对象，obj中的函数否则将被调用，则this为非严格模式下的全局对象，否则为null。

由于each使用(1)中的特殊方法将容器作为this传递，因此内部函数中的this应该是$('.some-elements')的结果，这是一个jquery包装的DOM节点数组。

Answer 2

在作为方法的回调发送的函数中，this引用DOM元素(对于包装在jQuery对象中的这个集合中的每个元素)，而不是window

更重要的是，回调是在当前DOM元素的上下文中触发的，因此关键字this引用该元素。

(顺便说一句，这使得elt arg有点多余；至少，我不太清楚为什么在这里同时使用this和elt来引用同一个东西)。

然而，并不是所有的DOM元素都定义了value属性:如果没有，它只为元素的一个子集设置：input、select、textarea、option等。这可能就是你得到undefined的原因。

您可以通过使用方法轻松地进行调整：

$('.some-elements').each($.proxy(function(elt){
    elt.innerHTML = this.value;
}, this));

现在，发送到.each()的函数使用外部this作为其上下文(显然，它不再像elt那样指向DOM元素)。

Answer 3

在第4行中，this.value引用了$('.some-elements')的"each“实例。在任何函数中，它都会引用该函数正在操作的对象。对于匿名函数，它是全局作用域。