基本用法

async函数返回一个 Promise 对象,可以使用then方法添加回调函数。当函数执行的时候,一旦遇到await就会先返回,等到异步操作完成,再接着执行函数体内后面的语句。

下面是一个例子。

  1. async function getStockPriceByName(name) {
  2. const symbol = await getStockSymbol(name);
  3. const stockPrice = await getStockPrice(symbol);
  4. return stockPrice;
  5. }
  6. getStockPriceByName('goog').then(function (result) {
  7. console.log(result);
  8. });

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

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

  1. function timeout(ms) {
  2. return new Promise((resolve) => {
  3. setTimeout(resolve, ms);
  4. });
  5. }
  6. async function asyncPrint(value, ms) {
  7. await timeout(ms);
  8. console.log(value);
  9. }
  10. asyncPrint('hello world', 50);

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

由于async函数返回的是 Promise 对象,可以作为await命令的参数。所以,上面的例子也可以写成下面的形式。

  1. async function timeout(ms) {
  2. await new Promise((resolve) => {
  3. setTimeout(resolve, ms);
  4. });
  5. }
  6. async function asyncPrint(value, ms) {
  7. await timeout(ms);
  8. console.log(value);
  9. }
  10. asyncPrint('hello world', 50);

async 函数有多种使用形式。

  1. // 函数声明
  2. async function foo() {}
  3. // 函数表达式
  4. const foo = async function () {};
  5. // 对象的方法
  6. let obj = { async foo() {} };
  7. obj.foo().then(...)
  8. // Class 的方法
  9. class Storage {
  10. constructor() {
  11. this.cachePromise = caches.open('avatars');
  12. }
  13. async getAvatar(name) {
  14. const cache = await this.cachePromise;
  15. return cache.match(`/avatars/${name}.jpg`);
  16. }
  17. }
  18. const storage = new Storage();
  19. storage.getAvatar('jake').then(…);
  20. // 箭头函数
  21. const foo = async () => {};