javascript - 解释一下这个 JavaScript onload 函数

Question

以下是在文档加载时注册函数的示例(大部分内容取自JavaScript:权威指南):

"use strict";

//run function f when document is loaded
function onLoad(f) {
    if (onLoad.loaded) // If already loaded
        window.setTimeout(f, 0); 
    else if (window.addEventListener) 
        window.addEventListener("load", f, false);
}

onLoad.loaded = false;
onLoad(function() { onLoad.loaded = true; });

onLoad(myfunc);

function myfunc() {
    console.log("Hello, world!");
}

我对 onLoad(function() { onLoad.loaded = true; }); 行感到困惑。我可以看出它是自调用，但再次使用函数名称让我感到困惑。为什么需要它？我发现如果我只执行 (function() { onLoad.loaded = true; }); 那么输出也是相同的。

最后，我可以使用以下方法获得相同的输出:

function myfunc() {
    console.log("Hello, world!");
}

window.onload = (function() {window.setTimeout(myfunc, 0);});

我的代码哪里更好/更差？

Answer 1

I'm getting confused with the line onLoad(function() { onLoad.loaded = true; });. I can tell that it's self-invocation, but using the function name again baffles me.

这不是自调用。

这是对带有一个参数(这是一个函数表达式)的函数 onLoad(之前定义的)的调用。

Finally, I can get the same output by using… How is my code better/worse?

您的代码将:

• 仅支持加载事件触发时调用的函数。如果您尝试分配另一个函数，它将覆盖前一个函数，而不是设置事件触发时调用的两个函数。
• 如果加载事件已经触发，则不会立即(或根本)调用该函数(因此您无法在可以动态添加到页面并正常使用的脚本中使用它)<