1. 程式人生 > >Promise 與 async函式

Promise 與 async函式

Promise 例項一經建立,執行器立即執行。

      new Promise((resolve, reject)=>{
        setTimeout(()=>{
          resolve('hello');
        },10000);
      }).then(value=>{
        return new Promise((resolve, reject)=>{
          .....
        });
      }).then(value=>{
        console.log(value);
      }).catch(err=>{
        console.log(err);
      }).finally(value=>{
        
      });

new Promise(function(resolve, reject){})
.then(function(value){})。Promise裡面的函式是立即執行的。等到裡面函式呼叫了resolve函式後,才會呼叫then中的function。then中預設會返回一個空Promise,此promise會預設立即執行resolve。也可以自己return一個promise,等此Promise中呼叫了resolve後才會繼續佇列中的then。

批量執行

Promise.all([p1,p2,p3]);

當所有子Promise都完成,該Promise完成,返回值是全部值的陣列。

有任何一個失敗,該Promise失敗,返回值是第一個失敗的子Promise的結果。

Promise.race([p1,p2,p3]);

區別在於,它只要有一個完成就算完成。

    常見用法。

        把非同步操作和定時器放在一起。

        如果定時器先觸發,就認為超時,告知使用者。


把回撥包裝成Promise

    有兩個好處,1.可讀性更好。2,返回的結果可以加入任何Promise佇列。


async

async函式返回一個 Promise 物件,可以使用then方法添加回調函式。當函式執行的時候,一旦遇到

await就會先返回,等到非同步操作完成,再接著執行函式體內後面的語句。

   async函式內部return語句返回的值,會成為then方法回撥函式的引數。

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);

處理異常。

async function f() {
  await Promise.reject('出錯了')
    .catch(e => console.log(e));
  return await Promise.resolve('hello world');
}

f()
.then(v => console.log(v))
// 出錯了
// hello world

如果有多個await命令,可以統一放在try...catch結構中。

async function main() {
  try {
    const val1 = await firstStep();
    const val2 = await secondStep(val1);
    const val3 = await thirdStep(val1, val2);

    console.log('Final: ', val3);
  }
  catch (err) {
    console.error(err);
  }
}

await命令後面的Promise物件,執行結果可能是rejected,所以最好把await命令放在try...catch程式碼塊中。

await命令只能用在async函式之中,如果用在普通函式,就會報錯。