co函数库源码解析

1 function* gen(){
2   var f1 = yield func1;
3   var f2 = yield fnuc2;
4    //sth to do 
5 };

1 // 手动执行
2 var wp = gen()
3 gen.next()
4 gen.next()
5 // co 函数
6 var co = require(‘co‘)
7 co(gen)

 1 /**
 2  * obj 是否promise
 3  * 利用promise.then存在且为function
 4  */
 5 
 6 function isPromise(obj) {
 7   return ‘function‘ == typeof obj.then;
 8 }
 9 
10 /**
11  * obj是否Generator
12  * 利用Generator的next 和 throw 两属性为Fuction的特点加以判断
13  */
14 
15 function isGenerator(obj) {
16   return ‘function‘ == typeof obj.next && ‘function‘ == typeof obj.throw;
17 }
18 
19 /**
20  * 是否Generator方法
21  * 利用constructor的name和displayName属性。
22  * @example
23  * var a = {}
24  * a.constructor === Object
25  * a.constructor.name // "Object"
26  */
27  
28 function isGeneratorFunction(obj) {
29   var constructor = obj.constructor;
30   if (!constructor) return false;
31   if (‘GeneratorFunction‘ === constructor.name || ‘GeneratorFunction‘ === constructor.displayName) return true;
32   return isGenerator(constructor.prototype);
33 }
34 
35 /**
36  * 判断是否干净对象 
37  * 利用constructor 属性。
38  * @example 
39  * Object.constructor === Object
40  */
41 
42 function isObject(val) {
43   return Object == val.constructor;
44 }

/**
 * 执行generator，返回一个promise对象
 * 首次调用即将整个fn包在主promise中
 */

function co(gen) {
  // 当前执行环境上下文
  var ctx = this;
  // 获取参数
  var args = slice.call(arguments, 1);
 
  return new Promise(function(resolve, reject) {
    /**
     * 生成一个gen实例
     * 如果不是gen函数，结束并执行resolve回调
     */
    if (typeof gen === ‘function‘) gen = gen.apply(ctx, args);
    if (!gen || typeof gen.next !== ‘function‘) return resolve(gen);
   
    //....
    
  });
}

 1 function onFulfilled(res) {
 2       var ret;
 3       try {
 4        /**
 5         * 执行next，获取执行结果 
 6         */ 
 7         ret = gen.next(res);
 8       } catch (e) {
 9         return reject(e);
10       }
11       // 调用实现自动执行的关键函数，next
12       next(ret);
13       return null;
14     }

 1 /**
 2      * next函数的实现
 3      * 一句话总结：如果为done，则value传入resolve并执行，否则调用co生成子promise，继续执行
 4      */
 5     function next(ret) {
 6       // done return 并执行reslove，即回到上层promise如果为主promise，则执行完成
 7       if (ret.done) return resolve(ret.value);
 8       // 执行结果创建子promise，不同数据结构实现方式不同
 9       var value = toPromise.call(ctx, ret.value);
10       // 将onFulfilled作为resolve传入，确保子promise执行完成之后回到主promise。
11       // 这样next执行链创建完成
12       if (value && isPromise(value)) return value.then(onFulfilled, onRejected);
13       return onRejected(new TypeError(‘You may only yield a function, promise, generator, array, or object, ‘
14         + ‘but the following object was passed: "‘ + String(ret.value) + ‘"‘));
15     }

 1 /**
 2  * 将obj转换成promise
 3  * obj无非为以下几种类型:
 4  * 1、非object的基本数据类型===>直接返回
 5  * 2、promise===>直接返回
 6  * 3、Generator对象和方法===> co调用
 7  * 4、thunk函数===>thunkToPromise
 8  * 5、Object  ===>objectToPromise 
 9  */
10 
11 function toPromise(obj) {
12   if (!obj) return obj;
13   if (isPromise(obj)) return obj;
14   // 主要看这里，能转化为generator函数的最终都要再次调用co函数，生成子promise，这样就完成了循环调用
15   if (isGeneratorFunction(obj) || isGenerator(obj)) return co.call(this, obj);
16   if (‘function‘ == typeof obj) return thunkToPromise.call(this, obj);
17   if (Array.isArray(obj)) return arrayToPromise.call(this, obj);
18   if (isObject(obj)) return objectToPromise.call(this, obj);
19   return obj;
20 }