window.onload = function(){ .. } 和 window.onload = function(){ .. }(); 之间的区别是什么？

Question

我正在一个项目中使用以下代码，但它并没有起作用：

window.onload=function(){
 //code here
};

但如果我在末尾加上()，它就有效了：

window.onload=function(){
 //code here
}();

我的问题是，两者有什么区别？为什么要在结尾加上 ()？

我猜测第一个选项无法工作是因为其他地方已经调用了“onload”，导致这个被覆盖了。

如果我总是使用第二个选项，它会有相同的行为吗？

- themazz

Answer 1

在函数结尾加上()，可以在声明后立即调用该函数。

window.onload=function(){
 //code ehere
}() // function is called 

在这种情况下

window.onload=function(){
 //code here
}; 

这个函数将在之后被调用

window.onload()

- Ilya

---

会像 document ready 一样吗？还是仍然会像 document onload？ - themazz

@themazz window.onload 将是 onload 函数执行的结果。请参考 furas 的答案。 - Ilya

@themazz 在这里阅读有关 onload 全局函数的信息：https://developer.mozilla.org/zh-CN/docs/Web/API/GlobalEventHandlers/onload - Ilya

@themazz 在页面加载前，你应该在<script>标签中声明window.onload函数。 - Ilya

Answer 2

当你在lambda函数后面加上()时，这意味着你在该行立即调用该函数。

例如：

var x=function() {
    return 5;
}();
console.log(x);

当执行代码时，控制台将会输出5。在这种情况下

window.onload=function() {
    //code here
}();

该函数很可能会返回另一个在页面加载时调用的函数。

例如，

window.onload=function() {
    return function() {
        console.log("Hello!");
    };
}();

在页面加载时，将在控制台记录“Hello！”

- TND

Answer 3

一个 function 被赋值给了 onload。

window.onload=function(){
 //code ehere
};

function的结果被赋值给onload

window.onload=function(){
 //code ehere
}();

- furas

---

只有我还是你把第一个代码块从Ilya那里复制过来了？ ;)（注意“ehere”）。 - Braiam

没有注意到我从答案中复制代码而不是从问题中复制 :) - furas

Answer 4

使用()将立即调用定义的函数。在这种情况下，最好返回一个函数以分配给window.onload。

- Markku K.