ES6立即调用函数表达式(IIFE)

本文概述

• 将功能转换为IIFE
• 关于IIFE的要点

这是一个JavaScript函数, 它会在定义后立即运行。可以使用IIFE(立即调用函数表达式)来避免从块内部进行变量提升。它允许公众访问方法, 同时保留函数中定义的变量的私密性。

IIFE是一种设计模式, 也称为自执行匿名功能。它包含两个主要部分：

• 第一部分是具有词法范围的匿名函数, 该函数包含在Grouping运算符()中。
• 第二部分创建IIFE, JavaScript引擎将通过该IIFE直接解释该函数。

语法

(function () 
{
    statements
})();

// Syntax of IIFE with ES6 arrow functions (though parentheses only allowed on outside)

(() => { /* ... */ })();

让我们尝试通过使用以下示例来理解IIFE的概念。

例子

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

输出如下

Hello World

将功能转换为IIFE

我们可以通过以下步骤将常规函数转换为IIFE：

• 假设任何常规函数定义。
• 将该定义包装在一对括号内, 这将创建函数表达式。
• 最后, 我们必须添加一对括号和一个分号来标记语句的结尾。

在下面的示例中, 让我们看一下相同的插图：

例子

// Regular Function. 
function hello() 
{ 
    console.log("Regular function"); 
}; 
// Regular Function execution. 
hello(); 
  
// IIFE creation and execution. 
(function() { console.log("Immediately Invoked Function Expression"); })();

输出如下

Regular function
Immediately Invoked Function Expression

关于IIFE的要点

• 立即调用的函数表达式(IIFE)具有其范围。在函数表达式中声明的变量在函数外部将不可用。
• 像其他功能一样, IIFE也可以是匿名的或命名的。
• IIFE也可以参数化。例如,

例子

(function (x, y, z) {
   console.log(x);
   console.log(y);
   console.log(z);
 })(100, 200, 300);

输出如下

100
200
300