JavaScript协程(function*/yield)转化为异步(async/await)
一直感觉这两者之间存在某种联系,奈何智商不够,辗转反侧了好几年,终于查到了一篇醍醐灌顶的回答 https://stackoverflow.com/questions/36196608/difference-between-async-await-and-es6-yield-with-generators
其中最关键的是打破yield
用法的思维定势。一般而言yield
在生成器函数里的作用相当于return
,是返回数据给调用方的,调用方是主体。而现在yield
需要变成类似await
的关键字,需要写成诸如let a = yield 1 + 2
的形式,a
应该等于yield
后面语句的值,也就是3
。现在生成器函数是执行的主体,而调用方则是辅助的。这叫“范式转移(Paradigm Shift)”
一步步来,首先不考虑异步,如何把生成器函数转化为顺序执行的函数,比如:
let foo = transform(function* () {
let a = yield 1 + 2;
let b = yield 3 + 4;
return a + b;
});
let bar = transform(function* () {
let c = yield foo()
return c + 5;
});
console.log(foo());
console.log(bar());
transform所做的工作就是循环执行function*
的next()
,每一次都把上一次的返回值原封不动地再传进去,最简单的写法就是,这里省略异常处理等工作:
function transform(fn) {
return function (...args) {
let gen = fn(...args);
let info = gen.next();
while (info.done != true) {
info = gen.next(info.value);
}
return info.value;
};
}
运行,得到了期待的结果:
10
15
当然,以上最简单的写法纯属“脱裤子放屁”,没有任何实际功能,把yield
都删掉结果一样,但是yield
的重大意义在于让表达式的返回值“出去再进来”绕了一圈,这样就能在transform
函数里进一步包装/解开Promise
,正如上述StackOverflow回答里面所写的那样。