Promise(resolve,reject)的基本使用

mmsmd發表於2021-11-29
Promise

什麼是Promise？

Promise是一個建構函式，其原型上有 then、catch方法，還有reslove，reject等靜態方法。通過建立Promise例項，可以呼叫Promise.prototype上的then、catch方法。

Promise的作用

MDN對Promise的描述：

Promise能夠將非同步操作最終成功返回值或者失敗原因和相應的處理程式關聯起來。 這樣使得非同步方法可以像同步方法那樣返回值：非同步方法並不會立即返回最終的值，而是會返回一個 Promise，以便在未來某個時候把值交給使用者。

簡單來說就是：使非同步方法也能夠根據其操作最終結果是成功還是失敗的具體情況繫結不同的後續處理事件

Promise的使用

一個 Promise 必然處於以下幾種狀態之一：（其中fulfilled狀態和rejected狀態也稱作settled狀態）

1、pending : 初始狀態，既沒有被兌現，也沒有被拒絕。

2、fulfilled : 意味著操作成功完成。

3、rejected : 意味著操作失敗。

處於初始狀態(pending)的Promise，最終要麼成功(fulfilled )要麼失敗(rejected )，無論成功還是失敗，通過then方法呼叫相關處理程式。

在例項化Promise的時候需要傳入 resolve 和 reject 這兩個函式作為其引數，當非同步任務順利完成且返回結果值時，會呼叫 resolve 函式；而當非同步任務失敗且返回失敗原因（通常是一個錯誤物件）時，會呼叫reject 函式。

then函式中有兩個引數，如下：

promise.then(successCallback, failureCallback);

第一個引數是狀態變為成功後應該執行的回撥函式，第二個引數是狀態變為失敗後應該執行的回撥函式。

具體使用例子：

let testPromise = new Promise((resolve,reject)=>{
        setTimeout(function(){
           // resolve('成功!') //狀態為成功，傳的引數作為then函式中成功函式的實參
           reject('失敗!') //狀態為失敗，傳的引數作為then函式中失敗函式的實參
        }, 1000);
});

testPromise.then((data)=>{
    console.log('success'+data)
},(err)=>{
    console.log('fail'+err)
})

列印結果 "fail失敗!"

其中 data 和 err 就是上面呼叫 resolve 和 reject 方法傳入的值。

Promise鏈式呼叫

由上面例子可以知道 Promise鏈式呼叫可以實現多個非同步操作連續執行，且上個操作執行成功後，執行下一個操作，幷包含上個操作返回的結果。

因此鏈式呼叫可以很好解決 回撥地獄 問題，避免了一層又一層的巢狀，雖然程式碼量可能沒有減少，但是程式碼結構更加清晰、易讀。

回撥地獄例子：

toDoA(function(result) {
  toDoB(result, function(newResult) {
    toDoC(newResult, function(finalResult) {
      console.log('最終結果: ' + finalResult);
    }, failureCallback);
  }, failureCallback);
}, failureCallback);

使用鏈式回撥：

toDoA()
.then(result => toDoB(result))
.then(newResult => toDoC(newResult))
.then(finalResult => {
  console.log(`'最終結果': ${finalResult}`);
})
.catch(failureCallback);

catch(failureCallback)可以看做then(null,failureCallback)

 

更多使用方法可以參考MDN

相關文章