如果 IIFE 没有返回，则在 IIFE 中使用绑定到事件侦听器的私有函数

Question

我正在使用 JavaScript 中的模块化模式。我总共有三个 IIFE：

第一个 return 是一个包含大量方法的对象。
第二个做同样的事情。
第三个调用方法 returned，因此控制应用程序的逻辑。

当您单击文档中的任意位置时，在第三个 IIFE 中调用的所有方法都绑定到一个事件侦听器。如果第三个 IIFE 运行s 而不是 return，则不会创建闭包，这意味着第三个 IIFE 会从堆栈中弹出，并带走在执行的创建阶段创建的变量对象上下文。

事件侦听器保存在内存中，它从第一个和第二个 IIFE 调用所有 returning 方法，因为它们是全局方法。但是，也绑定到事件侦听器的是我想在第三个 IIFE 中运行的私有函数。如果在第三个 IIFE 中没有创建闭包，那么当文档上的 click 事件发生时，如果变量对象在第三个 IIFE 中弹出堆栈并且不再是 no，那么事件侦听器会识别出第三个 IIFE 中的私有函数关闭已创建？

控制器 IIFE 尚未 returned，因此没有创建闭包，因此事件侦听器调用了一个当前不可用的函数，因为第三个 IIFE 已从堆栈中弹出，事件侦听器是否接受它是何时创建的范围？我理解 returning 方法是如何被调用的，因为它们仍然是全局的，但我很困惑在第三个 IIFE 完成后事件监听器如何调用私有函数。

查看下面的代码。第一个和第二个 IIFE 不存在，return 我在事件侦听器中调用的所有方法。为了避免在我正在从事的项目中使用冗长的代码让大家感到厌烦，我在下面对其进行了简化。

var scoreController = (function() {
  var score = 0;

  return {
    updateScore: function() {
      score++

      return score;
    }
  }
})();
var UIcontroller = (function() {
  return {
    updateUI: function(value) {
      document.querySelector("#displayScore").textContent = value;
    }
  }
})();
var controller = (function() {
  function setupEventListener() {
    document.addEventListener("click", updateGame);
  }

  setupEventListener();

  function privateFunction() {
    console.log("how does this work if")
  }

  function updateGame() {
    var globalScore = scoreController.updateScore();
    
    UIcontroller.updateUI(globalScore);
    privateFunction();
  }
})();

Answer 1

The controller IIFE has not returned so no closure is created

这是一个错误的结论。每个函数都可以并且确实形成了一个闭包，如果它是从函数创建的范围之外引用的。它不必从 IIFE returned为此 - 它也可以传递给另一个函数，它可以存储在全局变量中，或者它可以作为事件处理程序附加到 dom.

does an event listener take with it a scope of when it was created?

是的。每个功能都可以。 updateGame 关闭变量 privateFunction（以及更高范围内的 UIcontroller）。

如果 IIFE 没有返回，则在 IIFE 中使用绑定到事件侦听器的私有函数

Using a private function inside an IIFE tied to an event listener if IIFE has not returned

javascript

scope

event-listener

iife