什么是Promise

Promise是由社區(qū)最早提出并實(shí)現(xiàn)的，后加入到es6規(guī)范中。為更好處理javascript異步問題，用于解決其多次異步回掉嵌套問題。下面先嘗試下promise的基礎(chǔ)用法吧。

創(chuàng)建promise實(shí)例

var promise = new Promise(function(resolve,reject){if(flag){resolve("成功了");}else{reject("失敗了")}}) 復(fù)制代碼

解析上述代碼：

Promise是一個(gè)構(gòu)造函數(shù)，它接收一個(gè)function（用excurator代替）作為參數(shù)

其內(nèi)部規(guī)定其含有3種狀態(tài):

pedding(等待態(tài)): 在創(chuàng)建實(shí)例后，到未調(diào)用resolve和reject前都屬于pedding態(tài)。success(完成態(tài)--成功): 調(diào)用resolve(data)后處于成功態(tài)error(完成態(tài)--失敗): 調(diào)用reject(data)后處于失敗態(tài)

promise成完成態(tài)后，其狀態(tài)不會再發(fā)生變化

excurator可接收2個(gè)形參（resolve，reject），其都可接收1個(gè)形參，后期會傳入到then方法中。 resolve(data)后promise為success態(tài)。reject(data)后promise變?yōu)閑rror態(tài)

promise.then方法

promise.then(function(data){console.log(data) //==>成功了 data指的是resolve傳過來的值return 100;},function(e){console.log(e) //==>失敗了 e指的是reject傳過來的值}).then(function(data){ // ==> 鏈?zhǔn)秸{(diào)用console.log(data) // 100},function(e){}) 復(fù)制代碼

解析上述代碼：

promise.then(fun1,fun2)在調(diào)用時(shí)，若promise的狀態(tài)變?yōu)閟uccess時(shí)會調(diào)用fun1其接收resolve傳入的data，狀態(tài)變?yōu)閑rror會調(diào)用fun2接收reject傳入的失敗原因

promise的鏈?zhǔn)秸{(diào)用實(shí)現(xiàn)：then方法在調(diào)用后通過內(nèi)部機(jī)制返回一個(gè)新的promise來實(shí)現(xiàn)。

then鏈?zhǔn)秸{(diào)用時(shí)，第一種：上一個(gè)then的fun中有報(bào)錯(cuò)，會進(jìn)入當(dāng)前then的錯(cuò)誤中。第二種：上一個(gè)then的fun中有返回值，則直接進(jìn)入當(dāng)前then的正確邏輯中。第三種：若上一個(gè)then未有正確或錯(cuò)誤處理，則其接收值將會穿透，進(jìn)入當(dāng)前then中處理

promise.catch(function(e){...})

等同于promise.then(null,function(e){...}),若前面then中沒有錯(cuò)誤處理，則統(tǒng)一進(jìn)入此方法

let promise = new Promise(function(resolve,reject){...})promise.catch(function(data){}) 復(fù)制代碼

promise.finally(function(){})

不管 Promise 對象最后狀態(tài)如何，都會執(zhí)行的操作

let promise = new Promise(function(resolve,reject){...})promise.then(...).finally(function(){}) 復(fù)制代碼

let p = Promise.all([p1,p2...])

p1,p2指promise實(shí)例，在p1,p2...所有狀態(tài)都為成功時(shí)，p的狀態(tài)才為成功，任何一個(gè)失敗，即為失敗

Promise.all([p1,p2,p3]]).then(function (lists) {// ... lists是一個(gè)數(shù)組，其結(jié)果和[p1,p2,p3]的返回值一一對應(yīng) }).catch(function(reason){// ... }); 復(fù)制代碼

let p = Promise.race([p1,p2...])

p1,p2指promise實(shí)例，其任何一個(gè)狀態(tài)改變即會進(jìn)入p的then方法中去

Promise.race([p1,p2,p3]]).then(function (data) {// ... data為先返回結(jié)果的promise的返回值 }).catch(function(reason){// ... }); 復(fù)制代碼

let p = Promise.resolve(param) // Promise.reject(param)

兩個(gè)方法類似，分別會進(jìn)入后期的then中的正確/異常處理邏輯中去。其參數(shù)param會在內(nèi)部判斷，然后進(jìn)入不同處理。以resolve方法為例如下

param為promise實(shí)例。則直接進(jìn)入promise的調(diào)的resolve方法

param為thenable 對象，直接原封返回thenable對象的resolve對象

其它值，則直接將對象作為成功原因，返回

//param為promise實(shí)例 Promise.resolve(new Promise(function(resolve,reject){resolve("params的promise成功了") })).then(function(data){console.log(data) // params的promise成功了 })//param為thenable對象 Promise.resolve({then: function(resolve, reject) {resolve('成功了');} }).then(function(value) {console.log(value); // 成功了 });//param為其它對象 Promise.resolve(100).then(fucntion(data){console.log(data) // 100 }) 復(fù)制代碼

轉(zhuǎn)載于:https://juejin.im/post/5aa64634f265da23a334dee8

總結(jié)

以上是生活随笔為你收集整理的Promise详解（一） ----基础用法的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。