Question

我有一个简单的JSFiddle here来证明我的问题。

我有这个JavaScript代码：

var b = document.getElementById("b");

function A() {
    this.f = "1";
}

A.prototype.t = function() {
    b.innerHTML = this.f;
};

var a = new A();

var l = a.t;
l();

当我尝试调用a.t时，为什么this未定义？如何在不过度冗长或存储过多的情况下恢复上下文？

Answer 1

当我尝试调用a.t时，为什么这个未定义？

因为在JavaScript中，this主要由如何调用函数设置，而不是在其定义的位置。 a.t()在调用中将this设置为a，但l()将this设置为undefined（严格模式下）或全局对象（在松散模式下。）

更多（在我的博客上）：

唯一的例外是“绑定”函数（与Function#bind）或ES6的“箭头”函数（从定义它们的上下文中获取this）。

如何在不过度冗长或存储过多的情况下恢复上下文？

Function#bind通常是一个很好的答案：

var l = a.t.bind(a);
l();

它返回一个新函数，在调用时，调用原始函数，并将this设置为您给出的第一个参数bind。（你也可以绑定其他参数。）这是一个ES5函数，但如果你需要支持真正的旧浏览器，你可以很容易地填充它。

如果您只需要调用 l并使用特定的this值，而不是总是让它使用该值，那么Robert Rossmann points out就可以{ {1}}或Function#call：

Function#apply

Answer 2

JavaScript功能范围，

要为此执行具有正确值的函数，您需要将其绑定到正确的对象。例如，

var l= a.t.bind(a);

Answer 3

因为在将函数分配给新变量时上下文会发生变化。你总是可以做a.t();。

失去＆＃34;这个＆＃34;传递成员

3 个答案: