JavaScript異步回調(diào) then.js

浪打天門 2014-08-04

展開(kāi)全文

JavaScript異步回調(diào) then.js

Another very small promise!

能用簡(jiǎn)單優(yōu)美的方式將任何同步或異步回調(diào)函數(shù)轉(zhuǎn)換成then()鏈?zhǔn)秸{(diào)用！

then.js不同于其它promise，它沒(méi)有resolve、也沒(méi)有reject、更沒(méi)有promise對(duì)象，所以你不再需要把異步任務(wù)封裝成promise對(duì)象。

一個(gè)典型的promise都要封裝：

function getFile() {
    var deferred = Q.defer();

    FS.readFile("foo.txt", "utf-8", function (error, text) {
        if (error) {
            deferred.reject(new Error(error));
        } else {
            deferred.resolve(text);
        }
    });
    return deferred.promise;
}

getFile().then(successHandler[, errorHandler]);

若要進(jìn)入下一個(gè)then鏈，上面then中的successHandler、errorHandler還得進(jìn)行如上類似封裝，搞得挺復(fù)雜！

then.js只有then對(duì)象，它包括then、all和fail三個(gè)方法和觸發(fā)器defer，無(wú)需封裝，直接將異步任務(wù)寫入then()！因?yàn)閠hen、all和fail都能自動(dòng)生成下一個(gè)then對(duì)象，reject和resolve被合并為defer并注入任務(wù)函數(shù)，reject和resolve合并為defer的好處是，簡(jiǎn)化代碼，還可以直接代替callback！

then.js使用模式

直鏈：

then(function (defer) {
    // ....
    defer(err, ...);
}).then(function (defer, value) {
    // ....
    defer(err, ...);
}, function (defer, err) {
    // ....
    defer(err, ...);
}).then(function (defer) {
    // ....
    defer(err, ...);
}).all(function (defer, err, value) {
    // ....
    defer(err, ...);
}).then(function (defer) {
    // ....
    defer(err, ...);
}).fail(function (defer, err) {
    // ....
});

嵌套：

then(function (defer) {
    // ....
    defer(err, ...);
}).then(function (defer, value) {
    //第二層
    then(function (defer2) {
        // ....
        defer2(err, ...);
    }).then(function (defer2, value) {
        //第三層
        then(function (defer3) {
            // ....
        }).all(defer2); // 返回二層
    }).then(function (defer2) {
        // ....
        defer(err, ...); // 返回一層
    }).fail(defer); // 返回一層
}).then(function (defer) {
    // ....
    defer(err, ...);
}).fail(function (defer, err) {
    // ....
});

async 嵌套：

then(function (defer) {
    // ....
    defer(err, array);
}).then(function (defer, array) {
    then.each(array, function (next, value) {
        // ....逐步執(zhí)行同步或異步任務(wù)
        return next ? next() : defer();
    });
}).then(function (defer) {
    // ....
    defer(err, ...);
}).fail(function (defer, err) {
    // ....
});

then對(duì)象取代callback：

function getFileAsync() {
    return then(function (defer) {
        readFile(failname, defer);
    }).then(function (defer, fileContent) {
        // 處理fileContent
        defer(null, result);
    }).fail(function (defer, err) {
        // 處理error
        defer(err);
    });
}

getFileAsync().then(function (defer, file) {
    // ....
}).fail(function(defer, err) {
    // ....
});

更多用法請(qǐng)參考jsGen源代碼，里面包含了一百多個(gè)then任務(wù)鏈，幾百個(gè)then對(duì)象！

Who Used

API

promise模式：

入口函數(shù)then()：

var thenObj = then(function(defer) {
    // 執(zhí)行同步或異步任務(wù)
    defer(err, result1, ...);
})
// 入口函數(shù)返回then對(duì)象

then對(duì)象的then方法：

thenObj.then(function(defer, successResult, ...) {
    // Success Handler
    // 執(zhí)行同步或異步任務(wù)
    defer(err, result1, ...);
}, function(defer, successResult, ...) {
    // Error Handler，可選
    // 執(zhí)行同步或異步任務(wù)
    defer(err, result1, ...);
})
// then方法返回新的then對(duì)象（即下一個(gè)then鏈）

then對(duì)象的all方法：

thenObj.all(function(defer, err, successResult, ...) {
    // All Handler
    // 執(zhí)行同步或異步任務(wù)
    defer(err, result1, ...);
})
// all方法返回新的then對(duì)象（即下一個(gè)then鏈）

then對(duì)象的fail方法：

thenObj.fail(function(defer, err) {
    // Error Handler
    // 執(zhí)行同步或異步任務(wù)
    defer(err, result1, ...);
})
// fail方法返回新的then對(duì)象（即下一個(gè)then鏈）

關(guān)于Error收集器

then對(duì)象的then方法的errorHandler函數(shù)、all方法、fail方法均能收集error。其中then方法的errorHandler函數(shù)和all方法只能收集上一個(gè)then對(duì)象產(chǎn)生的error；fail方法則能收集再它之前所有then鏈產(chǎn)生的error。
關(guān)于觸發(fā)器defer

then.js中最關(guān)鍵的就是defer，用于觸發(fā)下一個(gè)then鏈。從上面可知，入口函數(shù)、then方法、all方法、fail方法中的任務(wù)函數(shù)的第一個(gè)參數(shù)都被注入了defer方法，如果任務(wù)函數(shù)本身是一個(gè)defer方法，則不會(huì)再被注入defer方法。

defer的第一個(gè)參數(shù)永遠(yuǎn)是error，如果error存在，則error下一個(gè)then對(duì)象的Error收集器，如果Error收集器不存在，則拋出error。

如果異步任務(wù)的callback的第一個(gè)參數(shù)為error，即callback(error, result1, …)的形式，則可直接用defer代替異步任務(wù)的callback。Node.js中的異步函數(shù)基本都是這種形式，then.js用起來(lái)超方便。
關(guān)于fail方法

fail方法能捕捉在它之前的then鏈中的任何一個(gè)error。fail的優(yōu)先級(jí)低于then方法的errorHandler和all方法，即then對(duì)象不存在then方法的errorHandler和all方法時(shí)error才會(huì)進(jìn)入fail。當(dāng)then鏈的某個(gè)then對(duì)象產(chǎn)生了error時(shí)，如果該then對(duì)象的下一個(gè)then對(duì)象存在Error收集器，則error進(jìn)入該Error收集器，否則error會(huì)直接進(jìn)入then鏈下游最近的fail方法，其間的then對(duì)象均會(huì)跳過(guò)。

async模式:

then.each(array, function (next, value, index, array) {
    // 逐步執(zhí)行同步或異步任務(wù)
    asyncTask(value, function () {
        return next ? next() : callback();
    })
});

Install

Node.js:

npm install thenjs

var then = require('thenjs');

Browser:

注意：then.js需要bind方法支持，IE8及以下請(qǐng)先加載es5-shim.js

Examples

then(function (defer) {
    // start asnys task
    // use defer as callback function
    asnycTask1(param, defer);
}).
then(function (defer, value1, ...) {
    // successHandler, value1, ... from asnycTask1
    asnycTask2(value1, ..., defer);
}, function (defer, err) {
    // errorHandler, err from asnycTask1
    console.error(err);
}).
then(function (defer, value) {
    // successHandler, value from asnycTask2
    asnycTask3(value, defer);
}).
then(function (defer, value) {
    // successHandler, value from asnycTask3
    asnycTask4(value, defer);
}).
fail(function (defer, err) {
    // global errorHandler, err from asnycTask2 or asnycTask3
    console.error(err);
});

No tags for this post.

JavaScript異步回調(diào) then.js

看看新聞網(wǎng)＞看引擎＞開(kāi)源產(chǎn)品

Another very small promise!

能用簡(jiǎn)單優(yōu)美的方式將任何同步或異步回調(diào)函數(shù)轉(zhuǎn)換成then()鏈?zhǔn)秸{(diào)用！

then.js不同于其它promise，它沒(méi)有resolve、也沒(méi)有reject、更沒(méi)有promise對(duì)象，所以你不再需要把異步任務(wù)封裝成promise對(duì)象。

一個(gè)典型的promise都要封裝：

function getFile() {
    var deferred = Q.defer();

    FS.readFile("foo.txt", "utf-8", function (error, text) {
        if (error) {
            deferred.reject(new Error(error));
        } else {
            deferred.resolve(text);
        }
    });
    return deferred.promise;
}

getFile().then(successHandler[, errorHandler]);

若要進(jìn)入下一個(gè)then鏈，上面then中的successHandler、errorHandler還得進(jìn)行如上類似封裝，搞得挺復(fù)雜！

then.js使用模式

直鏈：

then(function (defer) {
    // ....
    defer(err, ...);
}).then(function (defer, value) {
    // ....
    defer(err, ...);
}, function (defer, err) {
    // ....
    defer(err, ...);
}).then(function (defer) {
    // ....
    defer(err, ...);
}).all(function (defer, err, value) {
    // ....
    defer(err, ...);
}).then(function (defer) {
    // ....
    defer(err, ...);
}).fail(function (defer, err) {
    // ....
});

嵌套：

then(function (defer) {
    // ....
    defer(err, ...);
}).then(function (defer, value) {
    //第二層
    then(function (defer2) {
        // ....
        defer2(err, ...);
    }).then(function (defer2, value) {
        //第三層
        then(function (defer3) {
            // ....
        }).all(defer2); // 返回二層
    }).then(function (defer2) {
        // ....
        defer(err, ...); // 返回一層
    }).fail(defer); // 返回一層
}).then(function (defer) {
    // ....
    defer(err, ...);
}).fail(function (defer, err) {
    // ....
});

async 嵌套：

then(function (defer) {
    // ....
    defer(err, array);
}).then(function (defer, array) {
    then.each(array, function (next, value) {
        // ....逐步執(zhí)行同步或異步任務(wù)
        return next ? next() : defer();
    });
}).then(function (defer) {
    // ....
    defer(err, ...);
}).fail(function (defer, err) {
    // ....
});

then對(duì)象取代callback：

function getFileAsync() {
    return then(function (defer) {
        readFile(failname, defer);
    }).then(function (defer, fileContent) {
        // 處理fileContent
        defer(null, result);
    }).fail(function (defer, err) {
        // 處理error
        defer(err);
    });
}

getFileAsync().then(function (defer, file) {
    // ....
}).fail(function(defer, err) {
    // ....
});

更多用法請(qǐng)參考jsGen源代碼，里面包含了一百多個(gè)then任務(wù)鏈，幾百個(gè)then對(duì)象！

Who Used

API

promise模式：

入口函數(shù)then()：

var thenObj = then(function(defer) {
    // 執(zhí)行同步或異步任務(wù)
    defer(err, result1, ...);
})
// 入口函數(shù)返回then對(duì)象

then對(duì)象的then方法：

thenObj.then(function(defer, successResult, ...) {
    // Success Handler
    // 執(zhí)行同步或異步任務(wù)
    defer(err, result1, ...);
}, function(defer, successResult, ...) {
    // Error Handler，可選
    // 執(zhí)行同步或異步任務(wù)
    defer(err, result1, ...);
})
// then方法返回新的then對(duì)象（即下一個(gè)then鏈）

then對(duì)象的all方法：

thenObj.all(function(defer, err, successResult, ...) {
    // All Handler
    // 執(zhí)行同步或異步任務(wù)
    defer(err, result1, ...);
})
// all方法返回新的then對(duì)象（即下一個(gè)then鏈）

then對(duì)象的fail方法：

thenObj.fail(function(defer, err) {
    // Error Handler
    // 執(zhí)行同步或異步任務(wù)
    defer(err, result1, ...);
})
// fail方法返回新的then對(duì)象（即下一個(gè)then鏈）

關(guān)于Error收集器

then對(duì)象的then方法的errorHandler函數(shù)、all方法、fail方法均能收集error。其中then方法的errorHandler函數(shù)和all方法只能收集上一個(gè)then對(duì)象產(chǎn)生的error；fail方法則能收集再它之前所有then鏈產(chǎn)生的error。
關(guān)于觸發(fā)器defer

then.js中最關(guān)鍵的就是defer，用于觸發(fā)下一個(gè)then鏈。從上面可知，入口函數(shù)、then方法、all方法、fail方法中的任務(wù)函數(shù)的第一個(gè)參數(shù)都被注入了defer方法，如果任務(wù)函數(shù)本身是一個(gè)defer方法，則不會(huì)再被注入defer方法。

defer的第一個(gè)參數(shù)永遠(yuǎn)是error，如果error存在，則error下一個(gè)then對(duì)象的Error收集器，如果Error收集器不存在，則拋出error。

如果異步任務(wù)的callback的第一個(gè)參數(shù)為error，即callback(error, result1, …)的形式，則可直接用defer代替異步任務(wù)的callback。Node.js中的異步函數(shù)基本都是這種形式，then.js用起來(lái)超方便。
關(guān)于fail方法

fail方法能捕捉在它之前的then鏈中的任何一個(gè)error。fail的優(yōu)先級(jí)低于then方法的errorHandler和all方法，即then對(duì)象不存在then方法的errorHandler和all方法時(shí)error才會(huì)進(jìn)入fail。當(dāng)then鏈的某個(gè)then對(duì)象產(chǎn)生了error時(shí)，如果該then對(duì)象的下一個(gè)then對(duì)象存在Error收集器，則error進(jìn)入該Error收集器，否則error會(huì)直接進(jìn)入then鏈下游最近的fail方法，其間的then對(duì)象均會(huì)跳過(guò)。

async模式:

then.each(array, function (next, value, index, array) {
    // 逐步執(zhí)行同步或異步任務(wù)
    asyncTask(value, function () {
        return next ? next() : callback();
    })
});

Install

Node.js:

npm install thenjs

var then = require('thenjs');

Browser:

注意：then.js需要bind方法支持，IE8及以下請(qǐng)先加載es5-shim.js

Examples

then(function (defer) {
    // start asnys task
    // use defer as callback function
    asnycTask1(param, defer);
}).
then(function (defer, value1, ...) {
    // successHandler, value1, ... from asnycTask1
    asnycTask2(value1, ..., defer);
}, function (defer, err) {
    // errorHandler, err from asnycTask1
    console.error(err);
}).
then(function (defer, value) {
    // successHandler, value from asnycTask2
    asnycTask3(value, defer);
}).
then(function (defer, value) {
    // successHandler, value from asnycTask3
    asnycTask4(value, defer);
}).
fail(function (defer, err) {
    // global errorHandler, err from asnycTask2 or asnycTask3
    console.error(err);
});

No tags for this post.

本站是提供個(gè)人知識(shí)管理的網(wǎng)絡(luò)存儲(chǔ)空間，所有內(nèi)容均由用戶發(fā)布，不代表本站觀點(diǎn)。請(qǐng)注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購(gòu)買等信息，謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請(qǐng)點(diǎn)擊一鍵舉報(bào)。

轉(zhuǎn)藏 分享

QQ空間 QQ好友新浪微博微信

獻(xiàn)花（0） +1

來(lái)自：浪打天門 > 《nodejs》

舉報(bào)/認(rèn)領(lǐng)