JavaScript設計模式與開發實踐

　什麼是高階函數？

　　高階函數是指至少知足下列條件之一的函數：

　　1.函數能夠做爲參數被傳遞

　　2.函數能夠做爲返回值輸出

　　

　　1.函數做爲參數傳遞，這樣咱們能夠抽離出一部分容易變化的業務邏輯，把這部分業務放在函數參數中，這樣一來就能夠分離業務代碼中變化與不變的部分。常見的形式有：

　　1)回調函數

　　常見的回調如ajax中:當咱們使用ajax發出請求，可是不知道請求返回的確切時間，咱們可使用回調來解決，將callback看成參數傳入ajax請求的方法中，等請求完成後執行。

function getData(id, callback){
    $.ajax({
        type: 'GET',
        url: 'http://163.com/?getData='+id,
        dataType: 'json',
        success: function(data){
            callback(data);
        }
    })
}

getData(12345, function(data){console.log(data)})

　　回調函數不只可使用在異步請求中：

　　假如咱們想在頁面中建立一百個div節點，同時將這些節點都設置爲隱藏，能夠這麼實現

function appendDiv(){
    for(var i = 0; i < 100; i++){
        var div = document.createElement('div');
        div.innerHTML = i;
        document.body.append(div);
        div.style.display = 'none';
    }
}
appendDiv()

　　這樣寫看似沒有問題，可是當咱們下次修改需求，將100個div改變背景顏色，這段代碼就難以複用了。咱們能夠這樣：

function appendDiv(callback){
    for(var i = 0; i < 100; i++){
        var div = document.createElement('div');
        div.innerHTML = i;
        document.body.append(div);
        if(callback && typeof callback === 'function'){
            callback(div)
        }
    }
}
appendDiv(function(node){
    node.style.display = 'none'
})

　　經過使用回調，將業務代碼將在回調函數中，能夠抽離出一部分業務代碼，對代碼複用有很大的幫助。若是後期須要修改需求，改變顏色，改變大小等等只須要從新寫回調函數便可。

　　2)Array.prototype.sort，該方法接受一個函數做爲參數，這個函數告訴Array的排序規則，經過定義不一樣的方法實現不一樣的排序，使得sort很是靈活。

[1, 3, 4, 2].sort(function(a, b){
    return a-b;
})
//輸出[1, 2, 3, 4]

[1, 3, 4, 2].sort(function(a, b){
    return b-a;
})
//輸出[4, 3, 2, 1]

 

　　2.函數做爲返回值輸出

　　1)判斷數據的類型

　　如以前的文章 http://www.cnblogs.com/ppforever/p/4362102.html 判斷一個js對象是否是數組，將函數做爲返回值。稍加擴展：

var isType = function(type){
        //函數做爲返回值
    return function(obj){
        return Object.prototype.toString.call(obj) === '[object '+ type +']';
    }
}
var isArray = isType('Array');
var isString = isType('String');
var isNumber = isType('Number');

console.log(isArray([1, 6, 3]))
//true

咱們也可使用循環語句，批量註冊isType方法：

var Type = {};

for(var i = 0, type; type = ['String', 'Array', 'Number'][i++]; ){
    (function(type){
        Type['is'+type] = function(obj){
　　　　　　　　
            return Object.prototype.toString.call(obj) === '[object '+ type +']';
        }
    })(type)
}

Type.isArray([]); 
//true
Type.isString('abc');
//true
Type.isNumber(123);
//true
Type.isArray(123);
//false

　　上部分主要介紹高階函數的常見形式，下部分將着重介紹高階函數的高級應用。