为什么 setTimeout(location.reload) 会抛出 TypeError？ [复制]

Question

我试图理解这段代码的奇怪行为：

window.setTimeout(window.location.reload, 200);

• 在 Firefox 中，这会引发 TypeError：

  TypeError：在未实现接口 Location 的对象上调用了“重新加载”。

• 在 Chromium 中，这会引发另一个 TypeError：

  未捕获的类型错误：非法调用

---

这两种选择都可以正常工作：

• window.setTimeout('window.location.reload()', 200);
• window.setTimeout(function(){window.location.reload()}, 200)

为什么？

Answer 1

这是因为window.location.reload 将被脱离上下文调用，因此实际函数reload() 没有任何对location 对象的引用。

在 JavaScript 中，如果调用函数foo.bar()，则上下文为foo，因此this 指的是函数foo 内的foo。

但是，如果您分配var a = foo.bar，然后调用a()（这仍然是同一个函数），它将没有上下文，所以this 将是未定义的。这就是将函数作为方法参数传递时发生的情况。

解决此问题的常用方法是绑定上下文：

window.setTimeout(window.location.reload.bind(window.location), 200);

这确保函数将始终在window.location 的上下文中被调用，无论它如何被调用。

Mozilla docs 中有一个很好的例子。