這篇文章給大家介紹如何用ES7中的Async和Await進(jìn)行異步編程，內(nèi)容非常詳細(xì)，感興趣的小伙伴們可以參考借鑒，希望對大家能有所幫助。

創(chuàng)新互聯(lián)自2013年創(chuàng)立以來，是專業(yè)互聯(lián)網(wǎng)技術(shù)服務(wù)公司，擁有項(xiàng)目成都網(wǎng)站設(shè)計(jì)、做網(wǎng)站網(wǎng)站策劃，項(xiàng)目實(shí)施與項(xiàng)目整合能力。我們以讓每一個(gè)夢想脫穎而出為使命，1280元賓陽做網(wǎng)站,已為上家服務(wù),為賓陽各地企業(yè)和個(gè)人服務(wù),聯(lián)系電話:13518219792

Async/Await基本規(guī)則

1. async 表示這是一個(gè)async函數(shù)，await只能用在這個(gè)函數(shù)里面。

2. await 表示在這里等待promise返回結(jié)果了，再繼續(xù)執(zhí)行。

3. await 后面跟著的應(yīng)該是一個(gè)promise對象（當(dāng)然，其他返回值也沒關(guān)系，只是會(huì)立即執(zhí)行，不過那樣就沒有意義了…）

一個(gè)Async/Await例子

Async/Await應(yīng)該是目前最簡單的異步方案了，首先來看個(gè)例子。

這里我們要實(shí)現(xiàn)一個(gè)暫停功能，輸入N毫秒，則停頓N毫秒后才繼續(xù)往下執(zhí)行。

var sleep = function (time) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      resolve();
    }, time);
  })
};

var start = async function () {
  // 在這里使用起來就像同步代碼那樣直觀
  console.log('start');
  await sleep(3000);
  console.log('end');
};

start();

控制臺(tái)先輸出start，稍等3秒后，輸出了end。

獲得返回值

await等待的雖然是promise對象，但不必寫.then(..)，直接可以得到返回值。

var sleep = function (time) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      // 返回 ‘ok'
      resolve('ok');
    }, time);
  })
};

var start = async function () {
  let result = await sleep(3000);
  console.log(result); // 收到 ‘ok'
};

捕捉錯(cuò)誤

既然.then(..)不用寫了，那么.catch(..)也不用寫，可以直接用標(biāo)準(zhǔn)的try catch語法捕捉錯(cuò)誤。

var sleep = function (time) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      // 模擬出錯(cuò)了，返回 ‘error'
      reject('error');
    }, time);
  })
};

var start = async function () {
  try {
    console.log('start');
    await sleep(3000); // 這里得到了一個(gè)返回錯(cuò)誤
    
    // 所以以下代碼不會(huì)被執(zhí)行了
    console.log('end');
  } catch (err) {
    console.log(err); // 這里捕捉到錯(cuò)誤 `error`
  }
};

循環(huán)多個(gè)await

await看起來就像是同步代碼，所以可以理所當(dāng)然的寫在for循環(huán)里，不必?fù)?dān)心以往需要閉包才能解決的問題。

..省略以上代碼

var start = async function () {
  for (var i = 1; i <= 10; i++) {
    console.log(`當(dāng)前是第${i}次等待..`);
    await sleep(1000);
  }
};

值得注意的是，await必須在async函數(shù)的上下文中的。

..省略以上代碼

let 一到十 = [1,2,3,4,5,6,7,8,9,10];

// 錯(cuò)誤示范
一到十.forEach(function (v) {
  console.log(`當(dāng)前是第${v}次等待..`);
  await sleep(1000); // 錯(cuò)誤!! await只能在async函數(shù)中運(yùn)行
});

// 正確示范
for(var v of 一到十) {
  console.log(`當(dāng)前是第${v}次等待..`);
  await sleep(1000); // 正確, for循環(huán)的上下文還在async函數(shù)中
}

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持創(chuàng)新互聯(lián)。

關(guān)于如何用ES7中的Async和Await進(jìn)行異步編程就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，可以學(xué)到更多知識(shí)。如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到。

網(wǎng)站題目：如何用ES7中的Async和Await進(jìn)行異步編程
網(wǎng)頁路徑：http://jinyejixie.com/article2/pggjoc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站排名、網(wǎng)站設(shè)計(jì)公司、微信公眾號(hào)、App開發(fā)、營銷型網(wǎng)站建設(shè)、域名注冊

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)