koa学习笔记二---仿写co模块

2019年9月5日 183次阅读 来源: 怀疑真爱的流浪者jason

前言

koa依赖co模块来实现流程控制。co4.0.0版本之后，开始进行Promise化，维护团队表示可能会逐步放弃对其他yieldable对象的支持。到ES7的async，await之时（吐槽语：ES6还没发布，Node环境稍微好些，浏览器环境看不到边际），可能不再利用generator的hack来做流程控制，而是使用标准方法。

作为学习者，查看源代码，理解作者思想，仿写co模块还是必要的。
co-simplify: https://github.com/bornkiller/co-simplify。因为个人仿写，支持promise，promise array，generator，generatorFunction，thunk，错误处理当前并不完善。

原理简述

原理并不复杂，即采取异步编程的常规手段—promise链式调用。如果使用NPM q模块，就是不依赖ES6的promise实现。

step1(function (value1) {
    step2(value1, function(value2) {
        step3(value2, function(value3) {
            step4(value3, function(value4) {
                // Do something with value4
            });
        });
    });
});

通过回调来实现流程控制。回调少的时候无伤大雅，回调多时即成为“恶魔金字塔”，而使用promise可以提升代码流程控制粒度。

promisedStep1
  .then(onResolved, onRejected)
  .then(onResolved, onRejected)
  .then(function (value4) {
      // Do something with value4
  })

promise最重要便是then方法，在状态转化后，then内部定义的回调函数会立即触发。借此特性，可以将多层嵌套的callback转化为promise的链式结构。

之前对生成器一直存在误解，以为是yield本身实现异步控制。看过相关内容后，实际工作原理如下：
《koa学习笔记二---仿写co模块》
gen.next()方法获取第一个promise，如果迭代完毕，返回promise结束。如果迭代未完成，等待当前promise状态转化后，获取下一个promise，然后递归调用即可。yield的作用只是实现自动promise链式调用的接口，不用人为的书写then方法（自动化then后，promise携带的数据怎么获取，后面会写到），所以说co只是generator改造为流程控制的hack。

代码解析

代码内容见repo：https://github.com/bornkiller/co-simplify ，不再赘述，此处只说明难点问题。

难点攻坚

生成器函数内部的变量访问与普通函数有明显的差异，见如下示例：

var love = function *() {
    var step = 1;
    yield step+=1;
    yield step+=1;
    console.log(step);
};

var story = love();
story.next();
story.next();
story.next();

先定义普通变量，通过两次yield处理，输出结果为3.

var love = function *() {
    var step = 1;
    var first = yield step+=1;
    var second = yield step+=1;
    console.log(first);
    console.log(second);
    console.log(step);
};

var story = love();
story.next();
story.next();
story.next();

定义step，first，second变量，开始时我以为输出会是2，3，3，实际结果为undefined，undefined，3。原因很简单，因为yield执行后面的表达式之后，并不会返回任何值，所以first，second都是undefined。

稍作修改如下：

var love = function *() {
    var step = 1;
    var first = yield step+=1;
    var second = yield step+=1;
    console.log(first);
    console.log(second);
    console.log(step);
};

var story = love();
var step1 = story.next();
var step2 = story.next(step1.value);
var step3 = story.next(step2.value);

调用next方法传递参数，即输出2，3，3。感觉这个机制略显蛋疼，可以理解为将参数赋值给上次终止处yield前面的变量，然后再往下执行。即yield前面变量的值与后面表达式并不是绝对对应的关系。示例如下：

var love = function *() {
    var step = 1;
    var first = yield step+=1;
    var second = yield step+=1;
    console.log(first);
    console.log(second);
    console.log(step);
};

var story = love();
story.next();
story.next('A');
story.next('B');

实际输出为'A'，'B'，3。

联系方式

QQ：491229492
https://github.com/bornkiller

    原文作者：怀疑真爱的流浪者jason
    原文地址: https://segmentfault.com/a/1190000002396606
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞