Question

我最近偶然发现了IIFE，并对他们的目的很感兴趣。我知道它们习惯于自动调用函数，因此无需创建函数并在窗口加载时调用它。但是，他们应该如何正确使用？例如，这个：

window.addEventListener("load", function(){
    console.log("hello");
})

与此相同：

(
    function(){
        console.log("Hello");
    }();
)

那么何时应该使用IIFE？另外一个问题。这两者有什么区别？

Answer 1

IIFE通常用于创建局部范围，因此可以在不创建全局变量的情况下使用变量（或在循环内使用，以便在下一次迭代时不会覆盖变量）。

IIFE直接参与。当加载事件触发时（文档及其依赖项已加载）之后，将涉及加载处理程序。

Answer 2

立即 -Invoked Function Expression立即运行。

事件监听器或事件处理程序很可能不会。

var foo = "Old value";
(function() {
  console.log("Updating value");
  foo = "Variable has been updated";
})();
console.log(foo); // "Variable has been updated";

var foo = "Old value";
document.addEventListener('DOMContentLoaded', function() {
  console.log("Updating value, but it's too late");
  foo = "Variable has been updated";
});
console.log(foo); // "Old value";

应该如何使用立即调用的函数表达式，与window.onload有什么区别？

2 个答案: