1. 程式人生 > >函式宣告 函式表示式 匿名函式

函式宣告 函式表示式 匿名函式

函式宣告:使用function宣告函式,並指定函式名。 

function setFn() {
    // coding   
}

函式表示式:使用function宣告函式,但未指定函式名,將匿名函式賦予一個變數。

var setFn = function() {
    // coding
}

匿名函式:使用function關鍵字宣告函式,但未指定函式名。匿名函式屬於函式表示式,匿名函式有很多作用,賦予一個變數則建立函式,賦予一個事件則成為事件處理程式或建立閉包等等。

function() {
    // coding
}

函式宣告與函式表示式的不同在於:

1. 函式宣告可在當前作用域下提前呼叫執行,函式表示式需等執行到該函式後,方可執行,不可提前呼叫。

2. 函式表示式可直接在函式後加括號呼叫。

var setFn = function() {
    console.log(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

由此可見,加運算子確實可將函式宣告轉化為函式表示式,而之所以使用括號,是因為括號相對其他運算子會更安全,可以減少不必要的麻煩。

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

(function(a, b){
    console.log(a + b);
})(1, 2)
// 3

(function(){}())這樣寫的好處是在內部定義的變數不會跟外部的變數有衝突,達到保護內部變數的作用。