JavaScript中的函數模式詳解_javascript技巧

JavaScript設計模式的作用是提高程式碼的重用性，可讀性，讓程式碼更容易的維護與擴充

在javascript中，函數是一類對象，這表示他可以作為參數傳遞給其他函數；此外，函數還可以提供作用域。

建立函數的語法

命名函數表達式

複製程式碼 程式碼如下:

//命名函數表達式
var add = function add(a,b){
    return a b;
};

函數表達式

複製程式碼 程式碼如下:

//又稱匿名函數
var add = function(a,b){
    return a b;
};

為變數 add 賦的值是函數定義本身。這樣，add 就變成一個函數，可以在任何地方呼叫了。

函數的宣告

複製程式碼 程式碼如下:

function foo(){
    //code here
}  //這裡可以不需要分號

在尾隨的分號中，函數表達式應總是使用分號，而函數的聲明中並不需要分號結尾.

函數宣告與表達式

函數的提升（hoisting）

函數宣告的行為並不等同於命名函數表達式，其差異在於提升（hoisting）行為，看下面例子：

複製程式碼 程式碼如下:

對於所有變量，無論在函數體的何處進行聲明，都會在內部被提升到函數頂部。而對於函數通用適用，原因在於函數只是分配給變數的物件。

提升，顧名思義，就是把下面的東西提到上面。在JS中，就是把定義在後面的東西（變數或函數）提升到前面定義。 從上面的例子可以看出，在函數hoist內部中的foo和bar移動到了頂部，從而覆蓋了全域foo和bar函數。局部函數bar和foo的區別在於，foo被提升到了頂部且能正常運行，而bar()的定義並沒有得到提升，僅有它的聲明被提升，所以，當執行bar()的時候顯示結果為undefined而不是作為函數來使用。

即時函數模式

函數也是對象，因此它們可以作為回傳值。使用自執行函數的好處是直接宣告一個匿名函數，立即使用，省得定義一個用一次就不用的函數，而且免了命名衝突的問題，js中沒有命名空間的概念，因此很容易發生函數名字衝突，一旦命名衝突以最後聲明的為準。

模式一：

複製程式碼 程式碼如下:

<script><br />     (function () {<br />         var a = 1;<br />         return function () {<br />             alert(2);<br />         };<br />     }()());//彈出2，第一個圓括號自執行，第二個圓括號執行內部匿名函數<br /> </script>

模式二：自執行函數變數的指向

複製程式碼 程式碼如下:

模式三：巢狀函數

複製程式碼 程式碼如下:

模式四：自執行函數把它的回傳值賦給變數

複製程式碼 程式碼如下:

    var abc = (function () {
            var a = 1;
            return unction () {
                return a;
            }
        })();//自執行函數把return後面的函數回傳給變數
   alert(abc());//如果是alert(abc)就會彈出return語句後面的程式碼；如果是abc(),則會執行return後面的函數

模式五：函數內部執行自身，遞迴

複製程式碼 程式碼如下:

// 這是一個自執行的函數，函數內部執行自身，遞迴
function abc() { abc(); }

回呼模式

回呼函數：當你將一個函數write()作為一個參數傳遞給另一個函數call()時，那麼在某一時刻call()可能會執行（或呼叫）write()。這種情況下，write()就叫做回呼函數（callback function）。

非同步事件監聽器

回調模式有許多用途，例如，當附加一個事件監聽器到頁面上的一個元素時，實際上是提供了一個回調函數的指針，該函數將會在事件發生時被調用。如：

複製程式碼 程式碼如下:

document.addEventListener("click",console.log,false);

上面程式碼範例展示了在文件點擊事件時以冒泡模式傳遞給回調函數console.log()的

javascript特別適用於事件驅動編程，因為回調模式支援程式以非同步方式運作。

超時

使用回呼模式的另一個例子是，使用瀏覽器的window物件所提供的逾時方法：setTimeout()和setInterval()，如：

複製程式碼 程式碼如下:

庫中的回調模式

當設計一個js函式庫時，回呼函數將派上用場，一個函式庫的程式碼應盡可能使用可重複使用的程式碼，而回呼可以幫助實現這種通用化。當我們設計一個龐大的js庫時，事實上，使用者並不會需要其中的大部分功能，而我們可以專注於核心功能並提供「掛鉤形式」的回調函數，這將使我們更容易建立、擴展，以及自訂庫方法

Curry化

Curry化技術是一種透過把多個參數填充到函數體中，實現將函數轉換為一個新的經過簡化的（使之接受的參數更少）函數的技術。 ———【精通JavaScript】

簡單來說，Curry化就是一個轉換過程，也就是我們執行函數轉換的過程。如下例：

複製程式碼 程式碼如下:

當第一次呼叫add()時，它為傳回的內部函數建立了一個閉包。該閉包將原始的x和y值儲存到私人變數oldx和oldy。

現在，我們將可使用任意函數curry的通用方法，如：

複製程式碼 程式碼如下:

何時使用Curry化

當發現正在呼叫同一個函數時，並且傳遞的參數絕大多數都是相同的，那麼該函數可能是用於Curry化的一個很好的候選參數