理解javascript async的用法
写在前面
本文将要实现一个顺序读取文件的最优方法,实现方式从最古老的回调方式到目前的async,也会与大家分享下本人对于thunk库与co库的理解。实现的效果:顺序读取出a.txt与b.txt,将读出的内容拼接成为一个字符串。
同步读取
constreadTwoFile=()=>{ constf1=fs.readFileSync('./a.txt'), f2=fs.readFileSync('./b.txt'); returnBuffer.concat([f1,f2]).toString(); };
这种方式最利于我们理解,代码也很清楚,没有过多的嵌套,很好的维护,但是这种有着最大的问题,那就是性能,node所倡导的就是异步i/o来处理密集i/o,而同步的读取,很大的程度上浪费着服务器的cpu,这种方式的弊端明显的大于好处,所以直接pass掉。(其实node的任何异步编程的解决方案的目标都是要达到同步的语义,异步的执行。)
利用回调读取
constreadTwoFile=()=>{ letstr=null; fs.readFile('./a.txt',(err,data)=>{ if(err)thrownewError(err); str=data; fs.readFile('./b.txt',(err,data)=>{ if(err)thrownewError(err); str=Buffer.concat([str,data]).toString(); }); }); };
利用回调的方式,实现起来很简单,直接的嵌套下去就好,但是这种情况下很容易造成的就是不易维护,难以读懂的情况,最为极致的情况的就是回调地狱。
Promise实现
constreadFile=file=> newPromise((reslove,reject)=>{ fs.readFile(file,(err,data)=>{ if(err)reject(err); reslove(data); }); }); constreadTwoFile=()=>{ letbf=null; readFile('./a.txt') .then( data=>{ bf=data; returnreadFile('./b.txt'); }, err=>{thrownewError(err)} ) .then( data=>{ console.log(Buffer.concat([bf,data]).toString()) }, err=>{thrownewError(err)} ); };
Promise可以将横向增长的回调转化为纵向增长,能解决一些问题,但是Promise造成的问题就是代码冗余,一眼看过去,全部是then,也不是很爽,但是相比于回调函数嵌套来说,已经有了很大的提升。
yield
Generator很多语言中都有,本质上是协程,下面就来看一下协程,线程,进程的区别与联系:
- 进程:操作系统中分配资源的基本单位
- 线程:操作系统中调度资源的基本单位
- 协程:比线程更小的的执行单元,自带cpu上下文,一个协程一个栈
一个进程中可能存在多个线程,一个线程中可能存在多个协程,进程、线程的切换由操作系统控制,而协程的切换由程序员自身控制。异步i/o利用回调的方式来应对i/o密集,同样的使用协程也可以来应对,协程的切换并没有很大的资源浪费,将一个i/o操作写成一个协程,这样进行i/o时可以吧cpu让给其他协程。
js同样支持协程,那就是yield。使用yield给我们直观的感受就是,执行到了这个地方停了下来,其他的代码继续跑,到你想让他继续执行了,他就是会继续执行。
function*readTwoFile(){ constf1=yieldreadFile('./a.txt'); constf2=yieldreadFile('./b.txt'); returnBuffer.concat([f1,f2]).toString(); }
yield下的顺序读取呈现的也是一种顺序读取的方式,对于readFile来看有两种不同的实现方式,
利用thunkify
constthunkify=(fn,ctx)=>(...items)=>(done)=>{ ctx=ctx||null; letcalled=false; items.push((...args)=>{ if(called)returnvoid0; called=true; done.apply(ctx,args); }); try{ fn.apply(ctx,items); }catch(err){ done(err); } };
thunkify函数就是一种柯里化得思想,最后的传入参数done就为回调函数,利用thunkify可以很轻松的实现yield函数的自动化流程:
construn=fn=>{ constgen=fn(); letres; (functionnext(err,data){ letg=gen.next(data); if(g.done)returnvoid0; g.value(next); })(); };
利用Promise
constreadFile=file=> newPromise((reslove,reject)=>{ fs.readFile(file,(err,data)=>{ if(err)reject(err); reslove(data); }); }); construn=fn=>{ constgen=fn(); letstr=null; (functionnext(err,data){ letres=gen.next(data); if(res.done)returnvoid0; res.value.then( data=>{ next(null,data); }, err=>{thrownewError(err);} ); })(); }; run(readTwoFile);
上面两种方式都可以达到自动执行yield的过程,那么有没有一种方式,可以兼容这两种实现方式呢,tj大神又给出了一个库,那就是co库,先来看下用法:
//readTwoFile的实现与上面类似,readFile既可以利用Promise也可以利用thunkify //co库返回一个Promise对象 co(readTwoFile).then(data=>console.log(data));
来看下co库的实现,co库默认会返回一个Promise对象,对于yield之后的值(如上面的res.value),co库会将其转换为一个Promise。实现思想很简单,基本还是利用递归的方式,大体的思路如下:
constbaseHandle=handle=>res=>{ letret; try{ ret=gen[handle](res); }catch(e){ reject(e); } next(ret); }; functionco(gen){ constctx=this, args=Array.prototype.slice.call(arguments,1); returnnewPromise((reslove,reject)=>{ if(typeofgen==='function')gen=gen.apply(ctx,args); if(!gen||typeofgen.next!=='function')returnresolve(gen); constonFulfilled=baseHandle('next'), onRejected=baseHandle('throw'); onFulfilled(); functionnext(ret){ if(ret.done)reslove(ret.value); //将yield的返回值转换为Proimse constvalue=toPromise.call(ctx,ret.value); if(value&&isPromise(value))returnvalue.then(onFulfilled,onRejected); returnonRejected(newTypeError('yieldtypeerror')); } }); }
toPromise就是将一些类型转换为Promise,从这里我们可以看出的是可以将哪些类型放在yield后面,这里就来看一个常用的:
//把thunkify之后的函数转化为Promise的形式 functionthunkToPromise(fn){ constctx=this; returnnewPromise(function(resolve,reject){ fn.call(ctx,function(err,res){ if(err)returnreject(err); if(arguments.length>2)res=slice.call(arguments,1); resolve(res); }); }); }
最近Node已经支持了async/await,可以利用其来做异步操作:
终极解决
constreadFile=file=> newPromise((reslove,reject)=>{ fs.readFile(file,(err,data)=>{ if(err)reject(err); reslove(data); }); }); constreadTwoFile=asyncfunction(){ constf1=awaitreadFile('./a.txt'); constf2=awaitreadFile('./b.txt'); returnBuffer.concat([f1,f2]).toString(); }; readTwoFile().then(data=>{ console.log(data); });
async/await做的就是将Promise对象给串联起来,避免了then的调用方式,代码非常的易读,就是一种同步的方式。不再需要借助其他外界类库(比如co库)就可以优雅的解决回调的问题。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持毛票票。
声明:本文内容来源于网络,版权归原作者所有,内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:czq8825#qq.com(发邮件时,请将#更换为@)进行举报,并提供相关证据,一经查实,本站将立刻删除涉嫌侵权内容。