序言
在JavaScript中做触发器合作开发时，他们那时会不假思索的采用Async/Await。无论是mammalian却是以太网，Async/Await都能处置的较好，所以还确保了标识符的时效性。但，Async/Await是在ES6后忽然再次出现的， 这唤起了我的虚荣心，使我想再进一步的介绍它。责任编辑假定听众是对Promise和Async有很大介绍的，因而对此基础部份不做过多的描述。接着，我将透过下列四个部份来探究Async\Await:
Generator表达式手动开伞器内建继续执行Async表达式的同时实现基本上原理是将Generator表达式和手动开伞器包装袋在两个表达式里。
Generator表达式
基本上用语
Generator表达式是ES6提供更多的一类触发器程式设计软件系统，它的初始化形式与一般表达式那样，也是在表达式前面加之两对方括号。相同的是，初始化Generator表达式后，该表达式并不继续执行，回到的也并非表达式运转结论，而要两个对准外部状况的操作符第一类（结点器第一类）。接著，要初始化结点器第一类的next形式，外部操作符就从表达式颈部或上一场停下的地方性已经开始继续执行，直至碰到下两条yield句子（或return句子）年末。
function* helloWorldGenerator() {
yield hello;
yield world;
return ending;
}
var hw = helloWorldGenerator();
hw.next(); // { value: hello, done: false }hw.next(); // { value: world, done: false }
hw.next(); // { value: ending, done: true }
hw.next(); // { value: undefined, done: true }
触发器操作
Ajax是典型的触发器操作，他们试着透过Generator表达式部署Ajax，来达到同步表达的效果。
function* main() {
var result = yield request(“url”);
var res = JSON.parse(result);
console.log(res.value)
}
function request(url) {
makeAjaxCall(url, function(response) {
it.next(response);
});
}
var it = main();
it.next();
这样似乎能满足他们的要求，但如果他们增加了请求的数量，那结论就并非他们期望的那样美好了：他们需要不断的初始化next形式来逐个继续执行触发器请求。如果Generator能够手动继续执行就好了。
function main() {
var result1 = yield request(url1);
var res1 = JSON.parse(result1);
console.log(res1.value);
var result2 = yield request(url2);
var res2 = JSON.parse(result2);
console.log(res2.value)
}
function request(url) {
makeAjaxCall(url, function(response) {
it.next(response);
});
}
var it = main();
it.next();
it.next();
手动开伞器
如果要手动继续执行，他们首先就会想到用循环来处置。
function* gen() [
……
}
var g = gen();
var res = g.next();
while(!res.done) {
console.log(res.value);
res = g.next();
}
上面的标识符中，gen手动继续执行完所有步骤，但对于触发器操作而言，要确保前一步继续执行完才能继续执行后一步。根据经验，JavaScript中的回调表达式和Promise刚好满足这个要求。
基于Thunk（回调表达式）的手动开伞器
JavaScript中Thunk表达式是用来将多参表达式替换成只接受回调表达式作为参数的单参表达式。透过Thunk表达式，他们可以将next形式作为回调表达式传给 需要触发器操作的形式，当异步操作完成时，初始化next形式从而继续执行下两个操作，从而达到触发器操作同步继续执行的效果。
var fs = require(fs);
var thunk = function(fn) {
return function() {
var args = Array.prototype.slice.call(arguments);
return function(callback) {
args.push(callback);
return fn.apply(this, args);
}
}
};
var readFileThunk = thunk(fs.readFile);
function run(fn) {
var gen = fn();
function next(err, data) {
var result = gen.next(data);
if(result.done) return;
result.value(next);
}
next();
}
function* g() {
var f1 = yield readFile(fileA);
var f2 = yield readFile(fileB);
// …
var fn = yield readFile(fileN);
}
run(g);
基于Promise第一类的手动开伞器
除了thunk之外，Promise也可以同时实现手动开伞器。这其中的基本上原理也是类似的，也是在确保触发器操作完成的情况下初始化next形式，从而继续执行下一场的触发器操作。
var fs = require(fs);
var readFile = function(fileName) {
return new Promise(function(resolve, reject) {
fs.readFile(fileName, function(resolve, reject) {
if(error) return 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());
}
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);
内建继续执行
前面他们透过Generator表达式写了读取文件的标识符，接下来他们将它们改成async表达式的形式。
……
var asyncReadFile = async function() {
var f1 = await readFile(/etc/fstab);
var f2 = await readFile(/etc/shells);
console.log(f1.toString());
console.log(f2.toString())
}
透过比较就会发现，async表达式是将Generator表达式的星号(*)替换成async，将yield替换成await，接着内建了两个功能类似run的开伞器。他们用标识符模拟下一下这个开伞器。
async function fn(args) {
//……
}
// 等同于
function fn(args) {
return spawn(function* () {
//……
});
}
function spawn(genF) {
return new Promise(function(resolve, reject) {
var gen = genF();
function step(nextF) {
try {
var next = nextF();
} catch(e) {
return reject(e);
}
if(next.done) {
return resolve(next.value);
}
Promise.resovle(next.value).then(function(v) {
step(function(){
return gen.next(v);
});
}, function(e){
step(function() {
return gen.throw(e);
});
});
}
step(function() {
return gen.next(undefined);
});
});
}
总结
责任编辑从Generator表达式、手动开伞器再到内建继续执行，分拆导出了Async的基本上原理，希望能对大家有所帮助。
参考
ES6 入门教程
