JavaScript: "function onload() {}"与 "onload = function() {}"有何不同？

Question

在 this question 的答案中，我们读到 function f() {}在本地定义名称，而 [var] f = function() {}全局定义它。这对我来说很有意义，但是这两个声明之间存在一些不同的奇怪行为。

我用脚本制作了一个 HTML 页面

onload = function() {
    alert("hello");
}

它按预期工作。当我将其更改为

function onload() {
    alert("hello");
}

没啥事儿。 (Firefox 仍然触发了该事件，但 WebKit、Opera 和 Internet Explorer 没有，尽管坦率地说我不知道​​哪个是正确的。)

在这两种情况下(在所有浏览器中)，我都可以验证 window.onload和 onload被设置为功能。在这两种情况下，全局对象 this设置为窗口，我不管怎么写声明，window对象正在接收该属性就好了。

这里发生了什么？为什么一个声明与另一个声明的工作方式不同？这是 JavaScript 语言、DOM 还是两者之间的交互的怪癖？

Answer 1

这两个片段在当前范围内声明了一个名为“onload”的函数。没有绑定(bind)。

function onload() { ... }

.

var onload = function() { ... }

此代码段将函数分配给当前范围内名为“onload”的属性/变量/字段:

onload = function() { ... }

Firefox 执行绑定(bind)并在第一个片段上引发 onload 事件而其他片段没有执行的原因可能是因为 Firefox chrome(其用户界面)本身是使用 JavaScript 编写和自动化的 - 这就是它如此灵活且易于编写的原因对其进行扩展。不知何故，当您声明本地范围的 onload以这种方式运行，Firefox “替换”了 window的(很可能是当时的本地上下文)实现 onload (当时，一个空函数或未定义)，当其他浏览器正确地将声明“沙箱”到另一个范围(例如，global 或其他东西)时。