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

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

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

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

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

语法:

(function ()   
{  
    statements  
})();  

// 具有ES6箭头函数的IIFE语法(尽管仅允许在外部加上括号) 

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

我们将通过以下示例来理解IIFE的概念。

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

1.将函数转换为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

2.IIFE的要点

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

示例

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

执行上面示例代码,得到以下结果:

100
200
300