当前位置:首页 > 日记 > 正文

理解javascript async的用法

理解javascript async的用法

写在前面

本文将要实现一个顺序读取文件的最优方法,实现方式从最古老的回调方式到目前的async,也会与大家分享下本人对于thunk库与co库的理解。实现的效果:顺序读取出a.txt与b.txt,将读出的内容拼接成为一个字符串。

同步读取

const readTwoFile = () => {  const f1 = fs.readFileSync('./a.txt'),    f2 = fs.readFileSync('./b.txt');  return Buffer.concat([f1, f2]).toString();};

这种方式最利于我们理解,代码也很清楚,没有过多的嵌套,很好的维护,但是这种有着最大的问题,那就是性能,node所倡导的就是异步i/o来处理密集i/o,而同步的读取,很大的程度上浪费着服务器的cpu,这种方式的弊端明显的大于好处,所以直接pass掉。(其实node的任何异步编程的解决方案的目标都是要达到同步的语义,异步的执行。)

利用回调读取

const readTwoFile = () => {  let str = null;  fs.readFile('./a.txt', (err, data) => {    if (err) throw new Error(err);    str = data;    fs.readFile('./b.txt', (err, data) => {      if (err) throw new Error(err);      str = Buffer.concat([str, data]).toString();    });  });};

利用回调的方式,实现起来很简单,直接的嵌套下去就好,但是这种情况下很容易造成的就是不易维护,难以读懂的情况,最为极致的情况的就是回调地狱。

Promise实现

const readFile = file =>   new Promise((reslove, reject) => {    fs.readFile(file, (err, data) => {      if (err) reject(err);      reslove(data);    });  });const readTwoFile = () => {  let bf = null;  readFile('./a.txt')    .then(      data => {        bf = data;        return readFile('./b.txt');      },       err => { throw new Error(err) }    )    .then(      data => {        console.log(Buffer.concat([bf, data]).toString())      },       err => { throw new Error(err) }    );};

Promise可以将横向增长的回调转化为纵向增长,能解决一些问题,但是Promise造成的问题就是代码冗余,一眼看过去,全部是then,也不是很爽,但是相比于回调函数嵌套来说,已经有了很大的提升。

yield

Generator很多语言中都有,本质上是协程,下面就来看一下协程,线程,进程的区别与联系:

  • 进程:操作系统中分配资源的基本单位
  • 线程:操作系统中调度资源的基本单位
  • 协程:比线程更小的的执行单元,自带cpu上下文,一个协程一个栈

一个进程中可能存在多个线程,一个线程中可能存在多个协程,进程、线程的切换由操作系统控制,而协程的切换由程序员自身控制。异步i/o利用回调的方式来应对i/o密集,同样的使用协程也可以来应对,协程的切换并没有很大的资源浪费,将一个i/o操作写成一个协程,这样进行i/o时可以吧cpu让给其他协程。

js同样支持协程,那就是yield。使用yield给我们直观的感受就是,执行到了这个地方停了下来,其他的代码继续跑,到你想让他继续执行了,他就是会继续执行。

function *readTwoFile() {  const f1 = yield readFile('./a.txt');  const f2 = yield readFile('./b.txt');   return Buffer.concat([f1, f2]).toString();}

yield下的顺序读取呈现的也是一种顺序读取的方式,对于readFile来看有两种不同的实现方式,

利用thunkify

const thunkify = (fn, ctx) => (...items) => (done) => {  ctx = ctx || null;  let called = false;  items.push((...args) => {    if (called) return void 0;    called = true;    done.apply(ctx, args);  });  try {    fn.apply(ctx, items);    } catch(err) {    done(err);  }};

thunkify函数就是一种柯里化得思想,最后的传入参数done就为回调函数,利用thunkify可以很轻松的实现yield函数的自动化流程:

const run = fn => {  const gen = fn();  let res;  (function next(err, data) {    let g = gen.next(data);    if (g.done) return void 0;    g.value(next);  })();};

利用Promise

const readFile = file =>   new Promise((reslove, reject) => {    fs.readFile(file, (err, data) => {      if (err) reject(err);      reslove(data);    });  });const run = fn => {  const gen = fn();  let str = null;  (function next(err, data) {    let res = gen.next(data);    if (res.done) return void 0;    res.value.then(      data => {        next(null, data);      },       err => { throw new Error(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。实现思想很简单,基本还是利用递归的方式,大体的思路如下:

const baseHandle = handle => res => {  let ret;  try {    ret = gen[handle](res);  } catch(e) {    reject(e);  }  next(ret);};function co(gen) {  const ctx = this,    args = Array.prototype.slice.call(arguments, 1);  return new Promise((reslove, reject) => {    if (typeof gen === 'function') gen = gen.apply(ctx, args);    if (!gen || typeof gen.next !== 'function') return resolve(gen);    const onFulfilled = baseHandle('next'),      onRejected = baseHandle('throw');    onFulfilled();    function next(ret) {      if (ret.done) reslove(ret.value);      // 将yield的返回值转换为Proimse      const value = toPromise.call(ctx, ret.value);      if (value && isPromise(value)) return value.then(onFulfilled, onRejected);      return onRejected(new TypeError('yield type error'));    }  });}

toPromise就是将一些类型转换为Promise,从这里我们可以看出的是可以将哪些类型放在yield后面,这里就来看一个常用的:

// 把thunkify之后的函数转化为Promise的形式function thunkToPromise(fn) {  const ctx = this;  return new Promise(function (resolve, reject) {    fn.call(ctx, function (err, res) {      if (err) return reject(err);      if (arguments.length > 2) res = slice.call(arguments, 1);      resolve(res);    });  });}

最近Node已经支持了async/await,可以利用其来做异步操作:

终极解决

const readFile = file =>   new Promise((reslove, reject) => {    fs.readFile(file, (err, data) => {      if (err) reject(err);      reslove(data);    });  });const readTwoFile = async function() {  const f1 = await readFile('./a.txt');  const f2 = await readFile('./b.txt');    return Buffer.concat([f1, f2]).toString();};readTwoFile().then(data => {  console.log(data);});

async/await做的就是将Promise对象给串联起来,避免了then的调用方式,代码非常的易读,就是一种同步的方式。不再需要借助其他外界类库(比如co库)就可以优雅的解决回调的问题。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

相关文章

基于Git的常用撤销技巧与解决冲突

基于Git的常用撤销技巧与解决冲突

方法,推荐,解决冲突,常用,技巧,git checkout . #本地所有修改的。没有的提交的,都返回到原来的状态git stash #把所有没有提交的修改暂存到stash里面。可用git stash pop回复。git reset --hard HASH #返回到某个节点,不保留修改。git reset …

服务器只留下C盘管理员权限后,引来

服务器只留下C盘管理员权限后,引来

权限,服务器,只留下,电脑软件,在网上看了不少关于服务器安全的资料,今天把C盘其它一切权限都删了,只留了管理员,随之问题就来了,远程读取代码的功能不可用了花了好些时间才解决此问题,由于有些程序需要开启才能正常使用!一、系统没有开启FSO组件…

浅谈JavaScript中的apply/call/bin

浅谈JavaScript中的apply/call/bin

浅谈,电脑软件,JavaScript,apply,call,fun.apply(context,[argsArray])立即调用fun,同时将fun函数原来的this指向传入的新context对象,实现同一个方法在不同对象上重复使用。context:传入的对象,替代fun函数原来的this;argsArray:一个数组或者…

stormmedia是什么文件夹

stormmedia是什么文件夹

电脑软件,stormmedia,泓旭的笔记本电脑平时主要用来上网看电影,一天他在偶然间发现D盘里面有个stormmedia文件夹,打开看你们很多文件夹,而且名字很怪,泓旭开始以为是电脑中病毒,使用杀毒软件查杀发现stormmedia文件夹是正常的。但是删除stormmed…

PHP实现根据数组的值进行分组的方

PHP实现根据数组的值进行分组的方

方法,数组,电脑软件,PHP,本文实例讲述了PHP实现根据数组的值进行分组的方法。分享给大家供大家参考,具体如下:PHP根据数组的值分组,php array中没有自带这个函数但是很常用,今天写了出来记录一下。代码:$_array = array( array(1,11,'2016-0…

.NET适配器模式讲解

.NET适配器模式讲解

适配器模式,电脑软件,NET,适配器模式简介:将一个类的接口转换成客户希望的另外一个接口。Adapter模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。在计算机编程中,适配器模式(有时候也称包装样式或者包装)将一个类的接口适配成…

如何在一个Word文档文件设置一个立

如何在一个Word文档文件设置一个立

文件,设置,文档,如何在,电脑软件,无需边印,它是打印机本身的功能,称为全振幅印刷。但并非所有的印刷机都有此功能。以下是你的小文件,关于word文件的设置没有边框打印,希望对你有所帮助。 没有边框打印的Word文件设置 1。如果打印机没有这个…

如何使用ps动作的录制和编辑

如何使用ps动作的录制和编辑

如何使用,编辑,动作,电脑软件,ps,在我们介绍使用PS构建动作处理图片的几个例子之前,本章我们将学习我们自己的记录操作,这将是ps动作应用程序中最吸引人的部分之一。结合批量命令,您可以根据您的想法快速编辑数千张图片。 ps动作的录制和编辑…

MySQL启动1067错误并纠正在字符集

MySQL启动1067错误并纠正在字符集

字符集,启动,重新启动,错误,恢复,下载解压的官方网站mysql-5.6.37-winx64.zip版本,修改配置文件,安装服务,直接使用; 中国有一种混乱,解决方法: 在mysql-5.6.37-winx64目录,一个新的my.ini文件创建和配置(内容可以在互联网上找到或手动配置我的默…

PHP5.6新增加的可变函数参数用法分

PHP5.6新增加的可变函数参数用法分

函数参数,电脑软件,本文实例讲述了PHP5.6新增加的可变函数参数用法。分享给大家供大家参考,具体如下:今天无事,看了下PHP手册。发现PHP版本更新增加不少东西。下面就说说其中的PHP5.6更新中新增加的可变函数参数。代码1:function sum(...$numbe…

photoshop动作怎么安装

photoshop动作怎么安装

安装,动作,电脑软件,photoshop,   ps在绘图领域是当之无愧的霸主,它的各种功能简单方便,而photoshop中动作的应用更是给设计带来了方便,网络上提供了各式各样的现成录制的动作,所以学会安装动作是最基本的要领。本文为大家介绍怎么…

电脑版王者荣耀怎么玩?

电脑版王者荣耀怎么玩?

荣耀,王者,电脑软件,TGP是由腾讯推出的一款游戏助手平台,大部分玩家都会使用TGP启动游戏,其实TGP不仅可以玩网络游戏,手游也可以在TGP上玩耍,好多小伙伴都不知道吧,下面小编就给大家详细讲解一下具体的方法,快来看看吧!方法/步骤:1、下载腾讯的游…