溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
本文實例講述了JS co 函數庫的含義和用法。分享給大家供大家參考，具體如下：
繼續學習阮一峰老師異步編程四部曲之三：co
co在很早之前就聽超哥講過，說在node編程中大量用到，源碼很簡單，但是想法很強大。
讓我有空抓緊了解下，前一段時間弄離職的事情，跑來跑去累的夠嗆。
現在終于一切回歸正常了，還在拼命的適應新公司的節奏。只能趁周末繼續學習了。
好了，不瞎扯了，回歸主題，前兩篇文章我們分別學習了 Generator 函數和 Thunk 方式的自動執行。
今天我們接著上次的思路學習使用 co 工具實現 Generator 函數的自動執行。
再次拿出上一節的示例：
var fs = require('fs');
var thunkify = require('thunkify');
var readFile = thunkify(fs.readFile);
var gen = function* (){
var r1 = yield readFile('/etc/fstab');
console.log(r1.toString());
var r2 = yield readFile('/etc/shells');
console.log(r2.toString());
};
這段代碼用于讀取兩個文件，怎么使用 co 工具來實現自動執行呢？
很簡單：
var co = require('co');
co(gen);
上面代碼中，只要把 Generator 函數傳入 co 函數，就會自動執行。
co 函數返回一個 Promise 對象，因此可以用 then 方法添加回調函數，當 Generator 執行結束就會觸發回調：
co(gen).then(function (){
//success
});
這么看起來的話好像和我們之前的 Thunk 方式差不多啊，只是把 run 函數名改成了 co
唯一的區別是多了一層 Promise 包裝，那么 co 和 Thunk 到底有什么區別呢？
正如我們的猜測一樣，co 其實是將之前的兩種自動執行方式（Thunk 和 Promise）結合到了一起，包裝成一個庫。
使用它的前提和比Thunk多了一種 Promise 的情況，也就是yield返回值必須是 Thunk 函數和 Promise 對象之一
實現原理：
之前我們在研究 Thunk 函數時的第一步是使用 thunkify 將 readFile 包裝成 Thunk 函數：
今天我們研究 Promise 就需要把 readFile 包裝成 Promise 對象，看代碼：
var fs = require('fs');
var readFile = function (fileName){
return new Promise(function (resolve, reject){
fs.readFile(fileName, function(error, data){
if (error) reject(error);
resolve(data);
});
});
};
var gen = function* (){
var f1 = yield readFile('/etc/fstab');
var f2 = yield readFile('/etc/shells');
console.log(f1.toString());
console.log(f2.toString());
};
接下來是我特別喜歡老師做的一件事，先用最原始的方式，手動執行一遍代碼。
在我們日常開發的過程中，也可以參考這種方式。當邏輯復雜時，不妨先用最直白的方式把它實現，
然后再去發現里面的規則，去優化重構。又開始扯了，看一下手動執行的代碼：
var g = gen();
g.next().value.then(function(data){
g.next(data).value.then(function(data){
g.next(data);
});
});
手動執行其實就是用 then 方法，層層添加回調函數。理解了這一點，就可以寫出一個自動執行器:
function run(gen){
var g = gen(); //開始執行
function next(data){
var result = g.next(data);
if (result.done) return result.value;
result.value.then(function(data){
next(data);
});
}
next();
}
run(gen);
和Thunk函數的區別是，Thunk 函數在執行成功后把 next 傳給 thunkify ，讓 thunkify 來幫忙執行 next
這里的做法是吧 next 交給 Promise，promise 控制請求成功時執行 next。區別只有這么一點。
分析了原理之后，我們來分析下co的源碼：
co 函數接受一個 Generator 參數，返回一個 Promise 對象
function co(gen) {
var ctx = this;
return new Promise(function(resolve, reject) {
});
}
在返回的 Promise 對象里面，先檢查參數 gen 是否為 Generator 函數。如果是，就執行該函數，得到一個內部指針對象；
如果不是就返回，并將 Promise 對象的狀態改為 resolved 。
function co(gen) {
var ctx = this;
return new Promise(function(resolve, reject) {
if (typeof gen === 'function') gen = gen.call(ctx);
if (!gen || typeof gen.next !== 'function') return resolve(gen);
});
}
接著，co 對 next 方法進行包裝,使異常能夠暴露出來:
function co(gen) {
var ctx = this;
return new Promise(function(resolve, reject) {
if (typeof gen === 'function') gen = gen.call(ctx);
if (!gen || typeof gen.next !== 'function') return resolve(gen);
onFulfilled();
function onFulfilled(res) {
var ret;
try {
ret = gen.next(res);
} catch (e) {
return reject(e);
}
next(ret);
}
});
}
最后就是next方法了：
function next(ret) {
if (ret.done) return resolve(ret.value);
var value = toPromise.call(ctx, ret.value);
if (value && isPromise(value)) return value.then(onFulfilled, onRejected);
return onRejected(new TypeError('You may only yield a function, promise, generator, array, or object, '
+ 'but the following object was passed: "' + String(ret.value) + '"'));
}
});
next方法最主要的一行：
if (value && isPromise(value)) return value.then(onFulfilled, onRejected);
co的使用條件，每一次yield返回必須是Promise對象，當promist處理成功時再次執行onFulfilled
以此來達到自動執行的效果。
co 還支持并發的異步操作，yield 返回一個數組或者是支持遍歷的對象即可：
// 數組的寫法
co(function* () {
var res = yield [
Promise.resolve(1),
Promise.resolve(2)
];
console.log(res);
}).catch(onerror);
// 對象的寫法
co(function* () {
var res = yield {
1: Promise.resolve(1),
2: Promise.resolve(2),
};
console.log(res);
}).catch(onerror);
至此，co 的自動執行原理我們已經學習完成了，
其實本質上不是很難，只是涉及到的模塊較多，思路比較靈活
對我的小容量大腦來說，現在的認識還只到90%
所以這篇文章里面自己的思想比較少，更多的還是在復述老師的思路。
最后貼上原文的地址：co 函數庫的含義和用法
感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。
更多關于JavaScript相關內容可查看本站專題：《JavaScript常用函數技巧匯總》、《javascript面向對象入門教程》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
