zoukankan      html  css  js  c++  java
  • async / await对异步的处理

    虽然co是社区里面的优秀异步解决方案,但是并不是语言标准,只是一个过渡方案。ES7语言层面提供async / await去解决语言层面的难题。目前async / await 在 IE edge中已经可以直接使用了,但是chrome和Node.js还没有支持。幸运的是,babel已经支持async的transform了,所以我们使用的时候引入babel就行。在开始之前我们需要引入以下的package,preset-stage-3里就有我们需要的async/await的编译文件。

    无论是在Browser还是Node.js端都需要安装下面的包。

     npm install babel-core --save
     npm install babel-preset-es2015 --save
     npm install babel-preset-stage-3 --save
    

      

    这里推荐使用babel官方提供的require hook方法。就是通过require进来后,接下来的文件进行require的时候都会经过Babel的处理。因为我们知道CommonJs是同步的模块依赖,所以也是可行的方法。这个时候,需要编写两个文件,一个是启动的js文件,另外一个是真正执行程序的js文件。

    启动文件index.js

    require('babel-core/register');
    require('./async.js');
    

      真正执行程序的async.js

    const request = require('request');
    
    const options = {
      url: 'https://api.github.com/repos/cpselvis/zhihu-crawler',
      headers: {
        'User-Agent': 'request'
      }
    };
    
    const getRepoData = () => {
      return new Promise((resolve, reject) => {
        request(options, (err, res, body) => {
          if (err) {
            reject(err);
          }
          resolve(body);
        });
      });
    };
    
    async function asyncFun() {
     try {
        const value = await getRepoData();
        // ... 和上面的yield类似,如果有多个异步流程,可以放在这里,比如
        // const r1 = await getR1();
        // const r2 = await getR2();
        // const r3 = await getR3();
        // 每个await相当于暂停,执行await之后会等待它后面的函数(不是generator)返回值之后再执行后面其它的await逻辑。
        return value;
      } catch (err) {
        console.log(err);
      }
    }
    
    asyncFun().then(x => console.log(`x: ${x}`)).catch(err => console.error(err));
    

      

    注意点:

    • async用来申明里面包裹的内容可以进行同步的方式执行,await则是进行执行顺序控制,每次执行一个await,程序都会暂停等待await返回值,然后再执行之后的await。
    • await后面调用的函数需要返回一个promise,另外这个函数是一个普通的函数即可,而不是generator。
    • await只能用在async函数之中,用在普通函数中会报错。
    • await命令后面的 Promise 对象,运行结果可能是 rejected,所以最好把 await 命令放在 try...catch 代码块中。

    其实,async / await的用法和co差不多,await和yield都是表示暂停,外面包裹一层async 或者 co来表示里面的代码可以采用同步的方式进行处理。不过async / await里面的await后面跟着的函数不需要额外处理,co是需要将它写成一个generator的。

    promise.then().catch()的catch通过async/await怎么处理???

    try {
       const value = await getRepoData();
       return value;
     } catch (err) {
       console.log(err);
     }
    

     牛逼解释: https://segmentfault.com/a/1190000007535316

  • 相关阅读:
    CSS3特效----制作3D旋转照片展示区
    CSS3知识点整理(四)----布局样式及其他
    CSS3特效----制作3D旋转导航
    工作中遇到的问题--Hibernate一对多保存简化Service层代码
    工作中遇到的问题--BindException
    工作中遇到的问题--Hibernate注解添加在一方和多方的区别
    工作中遇到的问题--使用DTO减少数据字段
    工作中遇到的问题--实现程序运行时就加载CustomerSetting的第二种方法
    工作中遇到的问题--实现CustomerSetting的实时更新
    Hibernate--Enum类型的set集合映射到数据库(xml配置文件实现方式)
  • 原文地址:https://www.cnblogs.com/smzd/p/8665214.html
Copyright © 2011-2022 走看看