javascript – 如何立即调用IIFE防止它污染全球范围?

在关于立即调用的函数表达式的Udacity课程中(关于提供的代码片段),它说:

The function that is being returned closes over (i.e., captures) the
hi variable. This allows myFunction to maintain a private, mutable
state that cannot be accessed outside the function! What’s more:
because the function expressed is called immediately, the IIFE wraps
up the code nicely so that we don’t pollute the global scope
.

我很难理解调用匿名函数立即与阻止变量hi“污染全局范围”有什么关系,并且由于hi已经在函数中定义,它是不是已经在本地/私有范围内了?

const myFunction = (
  function () {
    const hi = 'Hi!';
    return function () {
      console.log(hi);
    }
  }
)();

解决方法:

在现代JavaScript中,你允许并阻止作用域(我非常确定const也有块作用域),所以你可以这样做:

let myFunction;
{
    let hi = 'Hi!';
    myFunction = function () {
        console.log(hi);
    };
}

这会创建myFunction,而不会泄漏到周围的范围.

在传统的JavaScript中,只有var和function scope,你可以这样做:

var myFunction;
function a_private_scope() {
    var hi = 'Hi!';
    myFunction = function () {
        console.log(hi);
    };
}
a_private_scope();

a_private_scope限制了hi的范围,但是(它是一个函数声明)需要显式调用它,我们仍然会向周围的范围泄漏一个名称(这次它是a_private_scope,函数的名称 – 作为a- a-范围).

通过使用函数表达式并立即调用它,我们避免了第二个名称污染:

var myFunction;
(function () {
    var hi = 'Hi!';
    myFunction = function () {
        console.log(hi);
    };
})();

现在,外部范围中唯一定义的是myFunction.作为hi范围的匿名函数没有名称可能会污染周围的范围.

最后我们可以使用返回值来清理它,所以我们不必两次提到myFunction:

var myFunction = function () {
    var hi = 'Hi!';
    return function () {
        console.log(hi);
    };
}();

(这也为我们节省了一对()因为函数关键字不再出现在语句的开头.)

上一篇:javascript – 执行IIFE的不同方法?


下一篇:javascript – 立即调用函数表达式(IIFE)与否