ES6 中的 三种异步解决方案

前置知识准备

Generator 函数 执行会返回一个迭代器(Iterator), 在迭代器上可以调用  next() 方法, 执行下一个 yield  或 return
调用  next() 方法，会返回一个对象 {value: res, done: false}, value 的值 为 yield 之后表达式的值，done 的值 表示迭代器，是否已经执行完毕（最后一个yield  或 return ）next() 方法，可以传入一个值，做为前一个yield 表达式的返回值

有了这些知识，可以把Promise 对象 做一个的 yield 的值，配合一个执行器，来处理异步操作

方式一： Generator + Promise + 执行器

const fs = require( 'fs')

// Promise 版的readFile

const readFile = function (fileName) { 

      return new Promise( function(resolve, reject) {

        fs.readFile(fileName, function(err, data){ 

              if (err) return reject(error); 

              resolve(data); 

         }) 

     })

}

const gen = function * () { 

     let f1 = yield readFile( 'a.txt'); 

     let f2 = yield readFile( 'b.txt'); 

     console.log( 'F1--->', f1.toString()); 

     console.log( 'F2--->', f2.toString());}

// 基于 Generator 和 Promise 的自动执行器

function run(gen){

    let g = gen(); 

    function next(data) { 

      let result = g.next(data); 

     (!result.done&&result.value) && result.value.then(next); 

    } 

    next();

}

run(gen);

执行器 中的 result.value 现在是一个Promise, 通过 then 方法拿到需要的结果，传下一次 next 方法，这样    let f1 = yield readFile('a.txt');  就可以拿到值！

方式二：Generator + Thunk函数 + 执行器

const fs = require( 'fs')

// 把一个单一执行的函数 ，变成需要再次调用的函数，固定一部分参数

function thunkify(fn, obj = {}) { 

     return function () { 

      let args = Array.from( arguments); 

      return function (m) { 

         args.push(m) 

        return fn.apply(obj, args) 

     } 

  }

}

const readFile = thunkify(fs.readFile, fs);

const gen = function () { 

      let f1 = yield readFile( 'a.txt'); 

      let f2 = yield readFile( 'b.txt'); 

      console.log( 'F1-->', f1.toString());

      console.log( 'F2-->', f2.toString());}

// 基于 Generator 和 Thunk函数的自动执行器

function run(fn) { 

      let gen = fn(); 

      function next(err, data) { 

          let result = gen.next(data); 

           if (result.done) return 1; 

          result.value(next); 

     } 

     next();

}

run(gen);

这里的 Thunk 转换器，把原来的 fs.readFile 函数 转换成需要两次调用的函数 ，readFile 的执行结果，可以通过回调函数能参数传递出来，再传给 next 方法

方式三：基于 async 函数 和 await 的异步处理方式 

const fs = require( 'fs')

// Promise 版的readFile

const readFile = function (fileName) { 

      return new Promise( function(resolve, reject) { 

            fs.readFile(fileName, function(err, data){ 

                  if (err) return reject(err); 

                  resolve(data); 

            }) 

      })

}

const asyncReadFile = async function () { 

      const f1 = await readFile( 'a.txt'); 

      const f2 = await readFile( 'b.txt'); 

      console.log(f1.toString()); 

      console.log(f2.toString());

};

asyncReadFile();

readFile 函数 对比方式一没有大的变化 ，Generator 函数变成 了 async 函数，可见 这处方式 只是 方式一的一个语法糖，async 函数自带了执行器！