你不知道的JS系列 ( 10 ) - 立即执行函数表达式

立即执行函数表达式(IIFE,Immediately Invoked Function Expression)
(function foo(){
  var a = 3;
  console.log(3);
})()
这种 (funciton foo(){...})()。第一个 () 将函数变成表达式,第二个 () 执行了这个函数。

 

相对于传统对 IIFE 很多人更喜欢另一个改进形式,((funciton foo(){...})()),第一种形式中函数表达式被包含在 () 中,然后在后面用另一个 () 括号来调用。第二种形式用来调用的 () 括号被移进了用来包装的 () 括号中。选择哪种全凭个人喜好。

 

IIFE 的另一个进阶用法是把它们当作函数调用并传递参数进去
var a = 2;
(function IIFE(global){
  var a = 3;
  console.log(a); // 3
  console.log(global.a) // 2
})(window);
console.log(a); // 2

在代码风格上对全局对象的引用变得比一个没有全局字样的变量更加清晰。可以从外部作用域传递任何你需要的东西,这对于改进代码风格是非常有帮助的

 

IIFE还有一种用途是倒置代码的运行顺序,尽管这种模式略显冗长,但有些人认为它更易理解
var a = 2;
(function IIFE(def){
  def(window)
})(function def(global){
  var a = 3;
  console.log(a); // 3
  console.log(global.a); //2
})

 

posted @ 2020-02-21 10:30  wzndkj  阅读(384)  评论(0编辑  收藏  举报