Question

我是JavaScript的新手，面对有关IIFE在JavaScript中工作方式的困惑。也就是说，我得到的是，它基本上是用于将转义变量分配给全局变量以避免冲突的。但这就是说，我们有一个类似的代码：

var number = 7;

(function() {
  var number = 7;
  alert(number);
})();
//In this code collision does not happen due to IIFE

但是如果我写：

var number = 7;

function num() {
  var number = 7;
  alert(number);
}

/*In this code there does not happen collisions and 
number variable is not assigned to the global scope as well. So, why use IIFE?*/
num();

Answer 1

立即调用函数表达式（IIFE）具有多种用途。您要关注的是，IIFE在声明其中的变量（或任何其他函数/方法）时不会污染全局范围。

使用IIFE的另一件重要事情是，它允许您的代码立即运行，而不会干扰其他人的代码。而且，IIFE的运行无需调用按名称的功能，该功能可能存在于 global 范围内。

这里的关键是您的代码是两种：不干扰全局范围内的事物，并且免受外部影响，因为全局范围内的任何内容都可能被错误地覆盖。

...您正在屏蔽可能会意外或有时故意更改全局变量的人！

在Mastering IIFEs上查看这篇中等文章，以了解更多信息。

更新

一个很好的例子说明了为什么第二个例子可能会对事情产生负面影响：

如果您导入某种类型的库，并且它在全局范围内（因为它未使用IIFE）具有名为num（该库在内部使用）的方法，则第二个示例将覆盖该方法，并使其在库中不可用。

这里的关键是它不只是作用域。在任何方法中声明的变量都作用于该方法，而不是全局作用域。 但是命名函数在全局范围内。

Answer 2

您正在引起很大的困惑。 IIFE不会影响局部变量和全局变量的工作方式。

关于全局变量和局部变量，您的两个示例之间没有区别。

都声明全局变量number并使用7（在函数外部）对其进行初始化，还使用一个变量也命名为number并在内部使用7进行初始化功能。函数内部的变量“覆盖”全局变量；全局变量number不能在函数内部使用（仅通过使用number名称），而alert()调用使用局部变量。

您可以使用以下代码变体轻松检查此问题：

var number = 7;

(function() {
  var number = 6;
  alert('local variable: ' + number);
})();
alert('global variable: ' + number);

和

var number = 7;

function num() {
  var number = 6;
  alert('local variable: ' + number);
}
num();
alert('global variable: ' + number);

上面的两个代码段几乎具有相同的效果。他们声明一个函数然后执行它。

唯一的区别是第二个在全局名称空间中创建了一个名为num的函数。

有时候我们不想创建一个命名函数。例如，仅使用一次时。在这种情况下，当声明一个函数然后仅调用一次时，将使用IIFE。它将声明和调用打包到一个表达式中，并且不会留下不再使用的函数。

关于IIFE工作方式的困惑

2 个答案: