从点击侦听器调用公共方法时，为什么需要匿名函数来封装

Question

我对范围和执行流程有一个不错的感觉，但是我很难理解为什么它不起作用：

var modalWindow = (function() {
    // Other code...
    modalBtn.addEventListener('click', modalWindow.closeModal);
    return {
        closeModal: function() {
            modalContainer.remove();
        }
    }
}());

这样做：

var modalWindow = (function() {
    // Other code...
    modalBtn.addEventListener('click', function() {
        modalWindow.closeModel());
    });
    return {
        closeModal: function() {
            modalContainer.remove();
        }
    }
}());

第一个抛出modalWindow是未定义的。 我知道我只需要声明一个命名对象并在其中放置closeModal ，然后对其进行引用即可，并且在侦听器中不需要匿名函数。 但是我很好奇后者为什么如此工作。

Answer 1

您提供的代码具有不匹配的( 。

我敢打赌，最终的结果看起来像这样：

})();

modalWindow的值是modalWindow的返回值…，但是直到IIFE 完成执行并实际返回一个值后 ，该值才得到。

在此之前，该值是undefined因此当您在IIFE完成之前尝试读取它时，它会出错。