摘要：模塊的私有變量是預(yù)先定義好的，而柯里化是保存第一次調(diào)用時(shí)傳入的參數(shù)為私有變量。

在平時(shí)的開發(fā)中，經(jīng)常會(huì)遇到一些特殊情況，就需要一些招式來(lái)應(yīng)對(duì)。這里總結(jié)一下自己常用到的一些小招式，有不足歡迎大家指出。

    var fuc1 = (function() {
        var a = "hello ";
        return function(str) {
            return a + str;
        }
    })()
    fuc1("world"); // hello world

模塊模式的一般形式是：一個(gè)定義了私有變量和函數(shù)；利用閉包創(chuàng)建可以訪問(wèn)私有變量和函數(shù)的特權(quán)函數(shù)；最后返回這個(gè)特權(quán)函數(shù)，或者把它們保存到一個(gè)可訪問(wèn)的地方。

該招式有以下應(yīng)用場(chǎng)景

代碼需要在兩個(gè)異步fuc1與fuc2都執(zhí)行結(jié)束后再執(zhí)行，

var manager = (function() {
    var count = 0;
    return function() {
        if(++count === 2){
            // logic 3
        }
    }
})()
function fuc1() {
    //...
}
function fuc2() {
    //...
}
setTimeout(function() {
   fuc1();
   manager();
}, 10)
setTimeout(function() {
   fuc2();
   manager();
}, 10)

var createXHR = (function () {
    if(typeof XMLHttpRequest != "undefined") {
        return function () {
            return new XMLHttpRequest();
        }
    }else if(typeof ActiveXObject != "undefined") {
        return function () {
            if(typeof arguments.callee.activeXString != "string") {
                var versions = ["MSXML2.XMLHttp.6.0", "MSXML2.XMLHttp.3.0", "MSXML2.XMLHttp"],
                    i,len;
                for(1 = 0, len = versions.length; i < len; i++){
                    try{
                        new ActiveXObject(versions[i]);
                        arguments.callee.activeXString = versions[i];
                        break;
                    }catch(ex){
                        // ...
                    }
                }
            }
            return new ActiveXObject(arguments.callee.activeXString);
        }
    }else{
        return function() {
            throw new Error("NO XHR object available.");
        }
    }
})();

var parse = (function() {
    var config = ["I", "II", "III", "IV"];
    return function(num) {
        return config[num - 1]
    }
})()
parse(1); // I
parse(4); // IV

柯里化聽起來(lái)很高大上，然而也就是Currying的音譯，千萬(wàn)別被名稱嚇跑了。
它是把接受多個(gè)參數(shù)的函數(shù)中的參數(shù)拆分成兩次調(diào)用來(lái)傳遞并返回結(jié)果的新函數(shù)。
舉一個(gè)簡(jiǎn)單的例子理解一下：

var add = function(a, b) {
    return a + b
}
add(1, 2) // 3

var currying = function(a) {
    return function(b) {
        return a + b
    }
}
currying(1)(2) // 3

add 為 接受多個(gè)參數(shù)的函數(shù),currying是將add中的參數(shù)分兩次調(diào)用傳入并返回結(jié)果的新函數(shù)。

仔細(xì)想想，它其實(shí)是模塊的衍生招式。模塊的私有變量是預(yù)先定義好的，而柯里化是保存第一次調(diào)用時(shí)傳入的參數(shù)為私有變量。因此它倆的區(qū)別是私有變量定義時(shí)機(jī)不同。

下面是一個(gè)利用柯里化實(shí)現(xiàn)的累加方法

var currying = function (fn) {
    var args = [];
    return function () {
        var innerArgs = Array.prototype.slice.call(arguments);
        if(innerArgs.length === 0){
            return fn.apply(null, args)
        }
        args = args.concat(innerArgs);
        return arguments.callee;
    }
}

var mutil = function () {
    var num = 0, i = 0;
    while(arguments[i]){
        num += arguments[i++]
    }
    return num
}

var add = currying(mutil);

add(1,2)(3);
add(4);

add();  // 10

某些代碼不可以在沒(méi)有間斷的情況下連續(xù)重復(fù)執(zhí)行，所有就需要節(jié)流。比如：拖動(dòng)某DOM元素時(shí)，需要?jiǎng)討B(tài)改變?cè)氐?x y ,就需要用到節(jié)流函數(shù)了。

function throttle(method, delay) {
    var timer = null;
    return function () {
        var that = this, args = arguments;
        clearTimeout(method.tId);
        timer = setTimeout(function () {
            method.apply(that, args);
            clearTimeout(timer);
        }, delay);
    }
}
window.onresize = throttle(resizeHandle, 50)

使用該函數(shù)時(shí)你會(huì)發(fā)現(xiàn)一個(gè)問(wèn)題：不斷拖動(dòng)元素的過(guò)程中元素是不動(dòng)的，只有停頓一下元素才跟著動(dòng)。
這樣的體驗(yàn)很糟糕，為了提高性能、改善體驗(yàn)，需要升級(jí)一下節(jié)流函數(shù)。設(shè)置一個(gè)最大時(shí)間間隔來(lái)確保在拖動(dòng)的過(guò)程中，元素可以跟隨移動(dòng)。

function throttle(method, context, delay, maxInterval) {
    var _start,_diff,timer;
    return function () {
        var that = this,
            args = arguments,
            _now  = +new Date();
        clearTimeout(timer);
        _start || (_start = _now);
        if(_now - _start >= maxInterval){
            method.apply(that, args)
        }else{
            timer = setTimeout(function () {
                method.apply(that, args)
            }, delay)
        }
    }
}
window.onresize = throttle(resizeHandle, 50, 100)

在業(yè)務(wù)中經(jīng)常會(huì)遇到一些不需要同步處理的，又比較耗時(shí)的邏輯。對(duì)于這些邏輯可以采用數(shù)據(jù)分塊（array chunking）的技術(shù)，小塊小塊地處理數(shù)組，通常每次一小塊?？梢詣?chuàng)建一個(gè)“待辦事項(xiàng)”隊(duì)列，然后使用定時(shí)器逐個(gè)取出“事項(xiàng)”，接著設(shè)置另一個(gè)定時(shí)器。

function chunk(array, process, context) {
    setTimeout(function() {
        var item = array.shift();
        process.call(context, item);

        if(array.length > 0){
            setTimeout(arguments.callee, 100);
        }
    }, 100)
}

函數(shù)可以將先前操作的結(jié)果記錄在某個(gè)對(duì)象里，從而避免重復(fù)運(yùn)算，比如計(jì)算階乘函數(shù)。

function memoizer(memory, handle) {
    return function (n) {
        var result = memory[n],
            recur  = arguments.callee;
        // 已運(yùn)算過(guò)則直接返回
        if(!result){
            result = handle(recur ,n);
            memory[n] = result;
        }
        return result;
    }
}

var memory    = [1, 1],
    factorial = memoizer(memory, function (recur, n) {
        return n * recur(n - 1)
    });

factorial(4);

console.log(memory);  // [1, 1, 2, 6, 24]

（未完待續(xù)......）