JavaScript當即執行函數

當即執行函數(Immediate Functions)

要了解當即執行函數,先了解函數的基本概念,函數聲明,函數表達式,匿名函數

函數聲明：使用function聲明函數，並指定函數名。

function foo() {
    // coding   
}

函數表達式：使用function聲明函數，但未指定函數名，將匿名函數賦予一個變量。

var foo = function() {
    // coding
}

匿名函數：使用function關鍵字聲明函數，但未指定函數名。匿名函數屬於函數表達式，匿名函數有不少做用，賦予一個變量則建立函數，賦予一個事件則成爲事件處理程序或建立閉包等等。

function() {
    // coding
}

 

函數聲明與函數表達式的不一樣在於：

1. 函數聲明可在當前做用域下提早調用執行，函數表達式需等執行到該函數後，方可執行，不可提早調用。

foo()
function foo() {
    // coding  
}
// 正常，函數聲明可提早調用

foo()
var foo = function() {
    // coding
} 
// 報錯，foo未保存對函數的引用，函數調用需放在函數表達式後面

2. 函數表達式可直接在函數後加括號調用。

var foo = function() {
    console.log(2)
}()

// 2   解析至此，可直接執行調用

當即執行函數(function(){})()能夠看出很像函數表達式的調用，但爲何要加括號呢？若是不加括號：

function(){
    console.log(1)
}()

// 報錯，函數須要函數名

解析： 雖然匿名函數屬於函數表達式，但未進行賦值，因此javascript解析時將開頭的function當作函數聲明，故報錯提示須要函數名

當即執行函數裏面的函數必須是函數表達式，因此由var setFn = function() {}()能夠理解爲在匿名函數前加了 = 運算符後，將函數聲明轉化爲函數表達式，因此拿！，+，-，（）...等運算符來測試下是否如此。

!function(){
    console.log(1)
}()
// 1
    
+function(){
    console.log(2)
}()
// 2
    
-function(){
    console.log(3)
}()
// 3
    
(function(){
    console.log(4)
})()
// 4

因而可知，加運算符確實可將函數聲明轉化爲函數表達式，而之因此使用括號，是由於括號相對其餘運算符會更安全，能夠減小沒必要要的麻煩。

當即執行函數與正常函數傳參形式是一致的。

 

這種模式有一些幾部分組成：

• 使用函數表達式定義一個函數(函數聲明不能起做用)
• 在結尾加上一對括號，讓函數當即被執行
• 將整個函數包裹在一對括號中(只有在你不將函數賦值給一個變量的時候才須要)

eg:

(function() {
        console.log("my first iife");
    })();

　　

這裏須要弄清楚一個概念 函數表達式和函數聲明

函數表達式  Function Expression - var expression= function() {}; 

函數申明     Function Declaration - function test() {};

這樣就好理解基本概念了吧！

下面來講爲何會考慮到馬上執行函數

由於在.net或者其餘平臺下,做用域scope是按照塊來劃分的,可是在javascript中,變量的做用域是按照函數劃分的,能夠這樣理解js中有時候並無block scope這種概念,只有function纔有本身的scope,所以IIFE實際建立了一個封閉的scope,能夠限制對變量和方法的訪問,有時候也會避免全局變量引發的命名衝突，因此他出現了.