q 筆記一:異步編程入門
源碼github地址在此,記得點(diǎn)星:
https://github.com/brandonxiang/example-q
前言
大家都知道javascript的優(yōu)點(diǎn)在于異步非阻塞。Javascript異步編程的4種方法指出javascript的單線程的特性和同步(Synchronous)異步(Asynchronous)的執(zhí)行模式,并且說明了四種異步的方法,如今最重要的當(dāng)然是Promises對(duì)象。
Promises對(duì)象是CommonJS工作組提出的一種規(guī)范,目的是為異步編程提供統(tǒng)一接口。
異步編程有著一個(gè)很大的效率優(yōu)勢(shì),但是異步多了就成為金字塔型的代碼結(jié)構(gòu)非常不好閱讀,而且異步和同步的控制變得非常非常困難。
$.getJSON('./api', function(data){
console.log(data);
$.getJSON('./api', function(data){
console.log(data);
}
})
這時(shí)候,我們需要Promise模式。這種模式其實(shí)在ES6已經(jīng)得到官配,參考Javascript 中的神器——Promise。但是有些人還停留在ES5的開發(fā),沒接觸node.js這時(shí)候,我們需要運(yùn)用一些第三方庫來控制異步的流程。
Promise在ES5實(shí)現(xiàn)
q的詳細(xì)說明
其他幾個(gè)資源庫都應(yīng)該大同小異,留給你們私下研究。
串行
then作為一個(gè)關(guān)鍵字,將函數(shù)async('first')和async('second')和async('third')和async('fourth')的順序分開,整體呈現(xiàn)完成第一個(gè)函數(shù)再完成第二個(gè)函數(shù)的序列操作。
async('first').then(function (resp) {
console.log(resp);
return async('second');
}).then(function (resp) {
console.log(resp);
return async('third')
}).then(function (resp) {
console.log(resp);
return async('fourth');
}).then(function (resp) {
console.log(resp);
});
并行
并行要把對(duì)應(yīng)的函數(shù)(async('a')和async('b')和async('c'))事先裝備在數(shù)組當(dāng)中。用Q.all()對(duì)它們進(jìn)行并行處理,也就是說這幾個(gè)函數(shù)將同時(shí)處理。
var promises = [];
promises.push(async('a'));
promises.push(async('b'));
promises.push(async('c'));
Q.all(promises);
串并行混連
無論是先串后并,還是先并后串都可以。在并行程序Q.all(promises)后,加入then關(guān)鍵字,實(shí)現(xiàn)串并行混連,非常適合在拉取數(shù)據(jù)后對(duì)所有數(shù)據(jù)進(jìn)行操作。
Q.all(promises).then(function(){
console.log('hello world');
})
總結(jié)
最終,這筆記寫的像是物理電路一樣,引用q官方文檔的一段代碼。
以前異步編程的代碼是這樣的。
step1(function (value1) {
step2(value1, function(value2) {
step3(value2, function(value3) {
step4(value3, function(value4) {
// Do something with value4
});
});
});
});
現(xiàn)在異步編程的代碼是這樣的。
Q.fcall(promisedStep1)
.then(promisedStep2)
.then(promisedStep3)
.then(promisedStep4)
.then(function (value4) {
// Do something with value4
})
.catch(function (error) {
// Handle any error from all above steps
})
.done();
轉(zhuǎn)載,請(qǐng)表明出處。總目錄前端經(jīng)驗(yàn)收集器