• js中的异步Promise、Generator、async


    Promise

    Promise是js异步编程的解决方案,Promise是一个对象,内部会存在一个异步操作,Promise对象提供统一的api来获取异步操作的结果。

    const promise = new Promise(function(resolve, reject) {
      // ... some code
    
      if (/* 异步操作成功 */){
        resolve(value);
      } else {
        reject(error);
      }
    });
    
    promise.then(function(value) {
      // success
    }, function(error) {
      // failure
    });

    Promise构造函数接收一个函数作为参数,函数的两个参数非别是resolve和reject,resolve将Promise对象的状态从“未完成”变为“成功”,reject将状态从“未完成”变为“失败”,并且两个方法会将异步操作的结果通过参数传递出去。

    Promise的then方法可以指定成功和失败的回调函数,并且将结果作为回调函数的参数。并且then方法返回一个新的Promise对象,所以可以链式调用。

    catch方法是then(null, rejection)的别名,用于指定在发生错误时的回调函数。如果采用链式写法,将catch放在最后,catch会捕捉到前面所有promise对象中的错误。

    finally方法不论Promise对象最后是什么状态都会执行。

    Promise.resolve()方法返回一个Promise对象,如果传入一个Promise对象会原封不动的返回此Promise对象,如果参数是一个原始值,会返回一个resolved状态的Promise对象,回调函数会立即执行。

    Generator函数

    Generator是ES6提供的一种异步编程解决方案,调用Generator返回一个遍历器对象,调用遍历器对象的next()方法会返回一个对象,对象的done属性指示是否遍历完,value属性指示状态值(yield 后面表达式的值)。

    function* helloWorldGenerator() {
      yield 'hello';
      yield 'world';
      return 'ending';
    }
    
    var hw = helloWorldGenerator();
    
    hw.next()
    // { value: 'hello', done: false }
    
    hw.next()
    // { value: 'world', done: false }
    
    hw.next()
    // { value: 'ending', done: true }
    
    hw.next()
    // { value: undefined, done: true }

     next()方法还接收一个参数,可以向Generator函数体内输入数据。下面第二个next的参数2传递给了上一个异步阶段返回的结果变量y。

    function* gen(x){
      var y = yield x + 2;
      return y;
    }
    
    var g = gen(1);
    g.next() // { value: 3, done: false }
    g.next(2) // { value: 2, done: true }

    async

    ES2017引入了async函数,async仅仅是Generator函数的语法糖,不同的是Generator函数需要调用next()方法一步步执行,async会自动执行。await命令后面可以是Promise对象,也可以是原始类型的值(会转变为resolved状态的Promise对象)。async函数返回一个Promise对象,return后的值会作为Promise对象then方法中成功回调函数中的参数。

    async function getStockPriceByName(name) {
      const symbol = await getStockSymbol(name);
      const stockPrice = await getStockPrice(symbol);
      return stockPrice;
    }
    
    getStockPriceByName('goog').then(function (result) {
      console.log(result);
    });

    await命令后面是一个Promise对象,返回改对象的结果。

  • 相关阅读:
    突然想谈谈——我的软件测试入门
    js+rem动态计算font-size的大小,适配各种手机设备!
    iOS 如何打测试包,直接给测试人员使用(绝对的新手入门)
    去掉无用的多余的空格(string1.前后空格,2.中间空格)
    iOS 自定义键盘ToolBar(与键盘的弹出、收起保持一致)
    iOS上线...踩坑
    iOS10 导航条,这个二狗子变了...踩坑
    ios程序发布测试打包
    获取毫秒级时间戳
    弹簧动画效果(系统自带方法)
  • 原文地址:https://www.cnblogs.com/ssw-men/p/11459462.html
Copyright © 2020-2023  润新知