await/async实际上是一种语法糖，以同步方式，实现异步操作。在实现过程中可以通过generator和promise来实现
实现代码
function generatorToAsync (generatorFn) {
return function () {
let g = generatorFn.apply(this, arguments); // generatorFn函数有可能传参
return new Promise((resolve, reject) => {
/* let next1 = g.next();
next1.value.then(res1 => {
let next2 = g.next(res1);
next2.value.then(res2 => {
let next3 = g.next(res2);
next3.value.then(res3 => {
resolve(g.next(res3).value);
});
});
}); */
// 是对注释代码部分的封装
function go (key, arg) {
let res;
try {
res = g[key](arg); // 有可能是reject和reslove
} catch (e) {
return reject(e); // 如果报错直接reject
}
const { value, done } = res;
if (done) {
// done 为ture说明执行完毕，直接返回结果
return resolve(value);
}
return Promise.resolve(value).then(res => go('next', res), err => go('throw', err));
}
// 执行go函数
go('next');
});
};
}
function fn (nums) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(nums * 2);
}, 1000);
});
}
function* gen () {
let num1 = yield fn(1);
let num2 = yield fn(num1);
let num3 = yield fn(num2);
return num3;
}
const AsyncFn = generatorToAsync(gen);
AsyncFn().then(res => {
console.log(res); // 输出8
});
上述关于async/await函数的实现是自己学习的记录，更详细的实现方法大家可以看一下7张图，20分钟就能搞定的async/await原理！为什么要拖那么久？ - 掘金 (juejin.cn)
