算法思维体操：基于generator生成器自己实现Async/Await（TypeScript）

ORIGIN全文地址:算法思维体操：基于generator生成器自己实现Async/Await（TypeScript）推荐：编程鼠标·电竞鼠标实现Async/Await要挑战的任务是使用JavaScript的generator生成器来实现Async/Await。问题描述下面是一个Async/Await函数的示例。asyncfunctiondoSomething(value){constresult1=awaitfetchFromNetwork(value+'-1');constresult2=awaitfetchFromNetwork(value+'-2');try{constresult3=awaitfailedFetchFromNetwork();}catch(error){console.error('Error fetching from network');}returnresult1+' '+result2;}doSomething('http://google.com').then(r=console.log(`Got result:${r}`)).catch(console.error)我们需要使用generator生成器和一个特别的封装函数“asynk”来实现同样功能。等效的示例为：constdoSomething=asynk(function*(value){constresult1=yieldfetchFromNetwork(value+'-1');constresult2=yieldfetchFromNetwork(value+'-2');try{constresult3=yieldfailedFetchFromNetwork();}catch(error){console.error('Error fetching from network');}returnresult1+' '+result2;});doSomething('http://google.com').then(r=console.log(`Got result:${r}`)).catch(console.error)关于“asynk“的注意事项：它接收一个generator生成器函数并返回一个新函数；当返回的函数被调用时，它应该返回一个Promise期约。Promise期约应当对generator生成器函数的返回值有所处理；返回函数的类型特征应该和传入generator生成器函数的类型特征匹配。唯一的例外是，如果generator生成器函数返回一个非Promise期约的类型，返回函数应该返回一个与那个类型相对应的Promise期约。待处理事项如果愿意的话，你可以先实现无类型的方案。有些人觉得使用类型有所帮助，另外一些人则觉得后续添加类型更容易；先关注控制流，然后才是参数值返回值可能有所帮助。规则你不能使用原生的Async/Await；请不要直接查阅与”如何使用generator生成器实现Async/Await“相关的网上资料。参考文献下面是一些你会觉得有用的链接。请悉听尊便访问这些链接，但务必仅限于此。https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Generatorhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Generator/next下面的类型定义或许有所裨益：interfaceGeneratorT=unknown,TReturn=any,TNext=unknownextendsIteratorT,TReturn,TNext{// NOTE: 'next' is defined using a tuple to ensure we report the correct assignability errors in all places.next(...args:[]|[TNext]):IteratorResultT,TReturn;return(value:TReturn):IteratorResultT,TReturn;throw(e:any):IteratorResultT,TReturn;[Symbol.iterator]():GeneratorT,TReturn,TNext;}interfaceIteratorYieldResultTYield{done?:false;value:TYield;}interfaceIteratorReturnResultTReturn{done:true;value:TReturn;}typeIteratorResultT,TReturn=any=IteratorYieldResultT|IteratorReturnResultTReturn;TypeScript代码模板：// See README.md for instructions.// TODO: add type annotations.functionasynk(fn:any){// YOUR CODE HERE}// Playgroud for testing the code.console.clear();function*countUp(){for(leti=0;i10;i++){yieldi;}}constg=countUp();console.log(g.next());console.log(g.next());// const playground = asynk(function* () {// const result = yield Promise.resolve('hello');// });// playground().catch(console.error)最终实现：无类型的JavaScript版本：functionasynk(fn){// YOUR CODE HEREreturn(...args)=newPromise((resolve,reject)={// Initialize the generator function, which might have signatures,// Extract the next() queue fisrt, then iterate another initialized generatorconstrunner=fn(...args);try{letpromiseCallbackQueue=[(res,slaveRunner)=slaveRunner.next(res).value,];letresult=runner.next();// First round, collect promiseCallbackwhile(!result.doneString(result.value)==='[object Promise]')