ES6中async基本用法有哪些?

Posted 水香木鱼

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ES6中async基本用法有哪些?相关的知识,希望对你有一定的参考价值。


async函数返回一个 Promise 对象,可以使用then方法添加回调函数。

当函数执行的时候,一旦遇到await就会先返回,等到异步操作完成,再接着执行函数体内后面的语句。

下面是一个例子。

async function getStockPriceByName(name) 
  const symbol = await getStockSymbol(name);
  const stockPrice = await getStockPrice(symbol);
  return stockPrice;


getStockPriceByName('goog').then(function (result) 
  console.log(result);
);

上面代码是一个获取股票报价的函数,函数前面的async关键字,表明该函数内部有异步操作。调用该函数时,会立即返回一个Promise对象。

下面是另一个例子,指定多少毫秒后输出一个值。

function timeout(ms) 
  return new Promise((resolve) => 
    setTimeout(resolve, ms);
  );


async function asyncPrint(value, ms) 
  await timeout(ms);
  console.log(value);


asyncPrint('hello world', 50);

上面代码指定 50 毫秒以后,输出hello world。

由于async函数返回的是 Promise 对象,可以作为await命令的参数。

所以,上面的例子也可以写成下面的形式。

async function timeout(ms) 
  await new Promise((resolve) => 
    setTimeout(resolve, ms);
  );


async function asyncPrint(value, ms) 
  await timeout(ms);
  console.log(value);

asyncPrint('hello world', 50);


async 函数有多种使用形式。

// 函数声明
async function foo() 
// 函数表达式
const foo = async function () ;
// 对象的方法
let obj =  async foo()  ;
obj.foo().then(...)
// Class 的方法
class Storage 
  constructor() 
    this.cachePromise = caches.open('avatars');
  

  async getAvatar(name) 
    const cache = await this.cachePromise;
    return cache.match(`/avatars/$name.jpg`);
  


const storage = new Storage();
storage.getAvatar('jake').then();
// 箭头函数
const foo = async () => ;

以上是关于ES6中async基本用法有哪些?的主要内容,如果未能解决你的问题,请参考以下文章

ES6 之 async 异步函数

ES6中async和await说明和用法

ES6 异步编程解决方案 之 Async

ES6 从入门到精通 # 20:async 的用法

ES6 从入门到精通 # 20:async 的用法

fetch普通用法及搭配async,await用法小记