深刻探析koa之异步回调处理篇

在上一篇中咱们梳理了koa当中中间件的洋葱模型执行原理,并实现了一个可让洋葱模型自动跑起来的流程管理函数。这一篇,咱们再来研究一下koa当中异步回调同步化写法的原理,一样的,咱们也会实现一个管理函数,是的咱们可以经过同步化的写法来写异步回调函数。javascript

1. 回调金字塔及理想中的解决方案

咱们都知道javascript是一门单线程异步非阻塞语言。异步非阻塞固然是它的一个优势,但大量的异步操做必然涉及大量的回调函数,特别是当异步嵌套的时候,就会出现回调金字塔的问题,使得代码的可读性很是差。好比下面一个例子:java

var fs = require('fs');

fs.readFile('./file1', function(err, data) {
  console.log(data.toString());
  fs.readFile('./file2', function(err, data) {
    console.log(data.toString());
  })
})

这个例子是前后读取两个文件内容并打印,其中file2的读取必须在file1读取结束以后再进行,所以其操做必需要在file1读取的回调函数中执行。这是一个典型的回调嵌套,而且只有两层而已,在实际编程中,咱们可能会遇到更多层的嵌套,这样的代码写法无疑是不够优雅的。python

在咱们想象中,比较优雅的一种写法应该是看似同步实则异步的写法,相似下面这样:git

var data;
data = readFile('./file1');
//下面的代码是第一个readFile执行完毕以后的回调部分
console.log(data.toString());
//下面的代码是第二个readFile的回调
data = readFile('./file2');
console.log(data.toString());

这样的写法,就彻底避免回调地狱。事实上,koa就让咱们可使用这样的写法来写异步回调函数:es6

var koa = require('koa');
var app = koa();
var request=require('some module');

app.use(function*() {
  var data = yield request('http://www.baidu.com');
  //如下是异步回调部分
  this.body = data.toString();
})

app.listen(3000);

那么,到底是什么让koa有这么神奇的魔力呢?github

2. generator配合promise实现异步回调同步写法

关键的一点,其实前一篇也提到了,就是generator具备相似"打断点"这样的效果。当遇到yield的时候,就会暂停,将控制权交给yield后面的函数,当下次返回的时候,再继续执行。编程

而在上面的那个koa例子中,yield后面的可不是任何对象均可以哦!必须是特定类型。在co函数中,能够支持promise, thunk函数等。promise

今天的文章中,咱们就以promise为例来进行分析,看看如何使用generator和promise配合,实现异步同步化。app

依旧以第一个读取文件例子来分析。首先,咱们须要将读文件的函数进行改造,将其封装成为一个promise对象:koa

var fs = require('fs');

var readFile = function(fileName) {
  return new Promise(function(resolve, reject) {
    fs.readFile(fileName, function(err, data) {
      if (err) {
        reject(err);
      } else {
        resolve(data);
      }
    })
  })
}

//下面是readFile使用的示例
var tmp = readFile('./file1');
tmp.then(function(data) {
  console.log(data.toString());
})

关于promise的使用,若是不熟悉的能够去看看es6中的语法。(近期我也会写一篇文章来教你们如何用es5的语法来本身实现一个具有基本功能的promise对象,敬请期待呦^_^)

简单来说,promise能够实现将回调函数经过 promise.then(callback)的形式来写。可是咱们的目标是配合generator,真正实现如丝般顺滑的同步化写法,如何配合呢,看这段代码:

var fs = require('fs');

var readFile = function(fileName) {
  return new Promise(function(resolve, reject) {
    fs.readFile(fileName, function(err, data) {
      if (err) {
        reject(err);
      } else {
        resolve(data);
      }
    })
  })
}

//将读文件的过程放在generator中
var gen = function*() {
  var data = yield readFile('./file1');
  console.log(data.toString());
  data = yield readFile('./file2');
  console.log(data.toString());
}

//手动执行generator
var g = gen();
var another = g.next();
//another.value就是返回的promise对象
another.value.then(function(data) {
  //再次调用g.next从断点处执行generator,并将data做为参数传回
  var another2 = g.next(data);
  another2.value.then(function(data) {
    g.next(data);
  })
})

上述代码中,咱们在generator中yield了readFile,回调语句代码写在yield以后的代码中,彻底是同步的写法,实现了文章一开头的设想。

而yield以后,咱们获得的是一个another.value是一个promise对象,咱们可使用then语句定义回调函数,函数的内容呢,则是将读取到的data返回给generator并继续让generator从断点处执行。

基本上这就是异步回调同步化最核心的原理,事实上若是你们熟悉python,会知道python中有"协程"的概念,基本上也是使用generator来实现的(我想当怀疑es6的generator就是借鉴了python~)

不过呢,上述代码咱们依然是手动执行的。那么同上一篇同样,咱们还须要实现一个run函数,用于管理generator的流程,让它可以自动跑起来!

3. 让同步化回调函数自动跑起来:一个run函数的编写

仔细观察上一段代码中手动执行generator的部分,也能发现一个规律,这个规律让咱们能够直接写一个递归的函数来代替:

var run=function(gen){
  var g;
  if(typeof gen.next==='function'){
    g=gen;
  }else{
    g=gen();
  }

  function next(data){
    var tmp=g.next(data);
    if(tmp.done){
      return ;
    }else{
      tmp.value.then(next);
    }
  }

  next();
}

函数接收一个generator,并让其中的异步可以自动执行。使用这个run函数,咱们来让上一个异步代码自动执行:

var fs = require('fs');

var run = function(gen) {
  var g;
  if (typeof gen.next === 'function') {
    g = gen;
  } else {
    g = gen();
  }

  function next(data) {
    var tmp = g.next(data);
    if (tmp.done) {
      return;
    } else {
      tmp.value.then(next);
    }
  }

  next();
}

var readFile = function(fileName) {
  return new Promise(function(resolve, reject) {
    fs.readFile(fileName, function(err, data) {
      if (err) {
        reject(err);
      } else {
        resolve(data);
      }
    })
  })
}

//将读文件的过程放在generator中
var gen = function*() {
  var data = yield readFile('./file1');
  console.log(data.toString());
  data = yield readFile('./file2');
  console.log(data.toString());
}
//下面只须要将gen放入run当中便可自动执行
run(gen);

执行上述代码,便可看到终端依次打印出了file1和file2的内容。

须要指出的是,这里的run函数为了简单起见只支持promise,而实际的co函数还支持thunk等。

这样一来,co函数的两大功能基本就完整介绍了,一个是洋葱模型的流程控制,另外一个是异步同步化代码的自动执行。在下一篇文章中,我将带你们对这两个功能进行整合,写出咱们本身的一个co函数!

这篇文章的代码一样能够在github上面找到:https://github.com/mly-zju/async-js-demo,其中promise_generator.js就是本篇的示例源码。

一样欢迎你们多多关注个人github pages我的博客哦,会不按期更新个人技术文章~

相关文章
相关标签/搜索