代码之家 › 专栏 › 技术社区 › Josh Lee ZZ Coder

JavaScript:“函数onload(){}”与“onload=function(){}”有何不同?

scope javascript

Josh Lee ZZ Coder · 技术社区 · 15 年前

在对 this question ,我们读到了 function f() {} [var] f = function() {} 对其进行全局定义。这对我来说很有道理,但是两个声明之间有一些奇怪的行为是不同的。

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

这一切都如期而至。当我把它改成

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

什么也没发生(Firefox仍然启动了该事件,但WebKit、Opera和Internet Explorer没有启动,尽管坦率地说,我不知道哪个是正确的。)

在这两种情况下(在所有浏览器中),我都可以验证 window.onload 和 onload 已设置为该功能。在这两种情况下,全局对象 this window 对象正在接收该属性。

这是怎么回事?为什么一个声明与另一个不同?这是JavaScript语言、DOM的怪癖还是两者之间的交互?

6 回复 | 直到 8 年前

linusg 8 年前

这两个代码段在当前作用域中声明了一个名为“onload”的函数。没有绑定。

function onload() { ... }

var onload = function() { ... }

此代码段将函数分配给当前作用域中名为“onload”的属性/变量/字段:

onload = function() { ... }

Firefox执行绑定并在第一个代码段上引发onload事件,而其他人没有这样做的原因可能是因为Firefox chrome(其用户界面)本身是使用JavaScript编写和自动化的——这就是为什么它如此灵活且易于在其上编写扩展的原因。不知何故,当您声明本地作用域 onload 通过这种方式,Firefox“取代”了 window 的(很可能是当时的本地上下文)实现 装载 (当时是空函数或未定义),当其他浏览器正确地将声明“沙盒”到另一个范围时(例如, global

Fenton 15 年前

许多人正确地指出了两者之间的全球/本地差异( 更新:这些答案现在大部分被作者删除了 )

var x = function() {

和

function x() {

但这并没有真正回答你的具体问题,因为你实际上并没有做第一个问题。

在您的示例中,两者之间的区别是:

// Adds a function to the onload event
onload = function() {
    alert("hello");
}

// Declares a new function called "onload"
function onload() {
    alert("hello");
}

Josh Lee ZZ Coder 15 年前

根据Tim Down的有益评论和与Jonathan Penn的简短讨论,以下是我认为正在发生的事情:

当JavaScript解释器将 window.onload onload

当你写声明的时候 function onload() {} 作语法分析 时间,而不是计算时间,脚本解释器在不告诉浏览器的情况下继续创建变量;或者窗口对象未准备好接收事件。不管是什么,浏览器都没有机会像你写作时那样看到作业 onload = function() {}

user216441 user216441 15 年前

最简单的解释是:

function aaaaaaa(){

可在声明之前使用:

aaaaaaa();
function aaaaaaa(){

}

但这不起作用:

aaaaaaa();
aaaaaaa=function(){

}

Josh Lee ZZ Coder 12 年前

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

也会在当地申报。

http://kangax.github.io/nfe/

-1

greim Claiohm 15 年前

这将生成一个错误:

foo();
var foo = function(){};

这并不是:

foo();
function foo(){}

因此,当您使用函数模块化和组织代码时,第二种语法更好,而第一种语法更适合作为数据范例的函数。