不熟悉生成器对象的小伙伴,可查看:Generator、Generator.prototype.next
模拟函数:
/** * 模拟async关键字的函数 * (不返回Promise对象也是可以的) * @param generator * @return {Promise} */ const _async = generator => { return new Promise((resolve, reject) => { // 获取iterator对象(可迭代对象) const gen = generator(); // 初始化iterator对象的next指针 let next = null; /** * 执行下一步 * @param {Iterator} genNextFn - gen.next函数 * @return {undefined} */ const goToNextStep = genNextFn => { try { // 更新next指针 next = genNextFn(); } catch(ex) { reject(ex); return; } // 如果完成了对iterator的遍历 if (next?.done === true) { resolve(next.value); return; } // 否则,递归执行下一步 Promise.resolve(next.value) .then(v => goToNextStep(() => gen.next(v))) .catch(e => goToNextStep(() => gen.next(e))); }; goToNextStep(() => gen.next()); }); }; const runMiniAsync = () => _async(function* () { const r1 = yield new Promise(resolve => setTimeout(() => resolve(1), 800)); console.log('===>', r1); const r2 = yield new Promise(resolve => setTimeout(() => resolve(2), 600)); console.log('==>', r2); }); runMiniAsync();
模拟函数执行过程示意:
// gen -> Iterator{} // next -> null // goToNextStep() // next -> { value: Promise{1}, done: false } // ::fulfilled(1) // goToNextStep() //// => yield 1 // next -> { value: Promise{2}, done: false } // ::fulfilled(2) // goToNextStep() //// => yield 2 // next -> { value: undefined, done: true } // ::end
标签:resolve,const,await,next,goToNextStep,Promise,async,JS,gen From: https://www.cnblogs.com/fanqshun/p/16667026.html