Promise小結

Promise的生命週期

每一個Promise都有本身的一個生命週期,開始未處理而後變成已處理。開始pedding狀態表示進行中,操做結束後。Promise可能進入如下兩種狀態某一個:
  • Fuiflled Promise操做完成。
  • Rejected 程序錯誤或者其餘緣由Promise爲能夠完成。

image.png

內部[[PromiseState]]用來表示三個狀態:pending,fulfilled及rejected。這個屬性並無暴露在Promise對象上,因此檢測不到。Promise狀態改變的時候經過then得到。promise

全部Promise都有then方法,兩個參數:第一個是Promise的狀態變爲fulfilled時候調用的函數,與異步操做有關數據傳遞給這個參數。第二個是變爲rejected時執行的函數,失敗相關附加數據能夠經過參數傳遞給這個拒絕函數。異步

  • Tips

注意new Promise的時候傳遞函數會當即執行而且函數體內的操做是一個同步操做。
new Promise((res,rej) =>{}),接收一個函數做爲參數,函數有兩個參數是兩個callback表示成功和失敗的時候執行的。函數

let p = new Promise((res,rej) => {
        console.log(1,'1')
        res("success")
        console.log(2,'2')
    })
    p.then((resolve)=>{
        console.log(resolve,'resolve')
    },(reject)=> {
        console.log(reject,'reject')
    })
    console.log(4)
    // 輸出順序 1 2 4 success

Promise鏈的返回值

Promise鏈的一個重要特性就是能夠給下游Promise傳遞數據,若是在完成處理程序中指定一個返回值,則能夠沿着這條鏈繼續傳遞數據。ui

  • Tips:
  • Promise鏈中的返回值若是是Promise對象的話根據返回的Promise狀態進行執行對應then和catch,若是return一個非Promise那麼會把它使用Promise.resolve包裝成爲一個fulfilled狀態的Promise。
  • 若是then中沒有return值,那就至關於return一個空的Promise對象(已完成狀態)。好比:
let a = new Promise((res,rej) => {
    res(6)
})
a.then((res) => {
    console.log(res,'第一個執行完成')
    // 6
}).then(res=> {
    console.log("第二個返回打印",res)
    // 第二個返回打印 undefined
})
鏈式調用Promise:
let p1 = new Promise(function (resolve,reject) {
    resolve(42)
})

p1.then(function(value) {
    console.log(value)
    // return一個常量 then中的return會自動包裝爲Promise.resolve(xx)
    return value+1
}).then((res) => {
    console.log(res) // 43
})

// 拒絕處理程序中是一樣的
let p1 = new Promise((reslove,reject) => {
    reject(42)
})

p1.catch((rej) => {
    console.log(rej)
    return rej+1 // return非Promise對象,使用Promise.resolve包裝
}).then((value) => {
    console.log(value) //43
})

Promise錯誤解決方案

Promise的錯誤捕捉有兩種方式
  1. then函數的第二個參數。
let a = new Promise((res,rej) => {
    rej(2)
})

a.then( (res) => {
    // success do
},(rej) => {
    // reject do
    console.log(2) // 2
})
  1. catch函數
let a = new Promise((res,rej) => {
    rej(2)
})
a.then(res => {
    // success do
}).catch(err => {
    // do sth
})
catch函數能夠在鏈式調用的時候看成整個鏈的Promise錯誤處理程序。
a.then(res=> {
    
}).then(res=> {
    
}).then((res) => {
    
}).catch(rej => {
    // 任意一個環節走到錯誤都會走到.catch這裏
    // 而且無return中斷環節的執行(由於已經catch失敗,第一個then就調用不到了,因此鏈式結束)。
})

Promise的繼承

Promise類和其餘內建類型一致,也能夠做爲基類派生類,因此也能夠定義本身的Promise變量來擴展Promise的功能。
class MyPromise extends Promise {
    // 使用默認的Promise構造函數
    success(resolve,reject) {
        return this.then(reslove,reject)
    }
    failure(reject) {
        return this.catch(reject)
    }
}
let promise = new MyPromise(function (resolve,reject) {
    resolve(42)
})
promise.success(function(value) {
    console.log(value)
},function(value) {
    console.log(value)
})

// or
promise.failure(function (value) {
    console.log(value)
})
這個例子中擴展了兩個success和failure方法。 這兩個方法都經過this調用它模仿的方法,派生Promise與內建Promise功能一致,只不過多了success和failure這兩個能夠調用的方法。

用於靜態方法會也會被繼承,所以派生的Promise也都存在MyPromise.resolve(),MyPromise.reject(),MyPromise.all(),MyPromise.race()靜態方法。
後二者與內建方法徹底不一樣,前兩個稍有不一樣。this

相關文章
相關標籤/搜索