Javascript中Promise的四種常用方法總結(jié)

前言

成都創(chuàng)新互聯(lián)服務(wù)項(xiàng)目包括稱多網(wǎng)站建設(shè)、稱多網(wǎng)站制作、稱多網(wǎng)頁制作以及稱多網(wǎng)絡(luò)營銷策劃等。多年來，我們專注于互聯(lián)網(wǎng)行業(yè)，利用自身積累的技術(shù)優(yōu)勢(shì)、行業(yè)經(jīng)驗(yàn)、深度合作伙伴關(guān)系等，向廣大中小型企業(yè)、政府機(jī)構(gòu)等提供互聯(lián)網(wǎng)行業(yè)的解決方案，稱多網(wǎng)站推廣取得了明顯的社會(huì)效益與經(jīng)濟(jì)效益。目前，我們服務(wù)的客戶以成都為中心已經(jīng)輻射到稱多省份的部分城市，未來相信會(huì)繼續(xù)擴(kuò)大服務(wù)區(qū)域并繼續(xù)獲得客戶的支持與信任！

Promise是JavaScript異步操作解決方案，最近看到項(xiàng)目里不少人用了Promise 的庫類，比如 bluebird、q 、jQuery.Deffered 等 polyfill promise 方式，使用的時(shí)候翻看長長的文檔，真心累覺不愛。

es5 發(fā)展到現(xiàn)在，node 在0.12版本就已經(jīng)支持了promise，在客戶端，大部分瀏覽器也支持了Promise，如果要兼容低版本的瀏覽器，可以加上es5-shim等 polyfill promise。下面話不多說，來一起看看詳細(xì)的介紹：

用法

Promise 常用場(chǎng)景。

處理異步回調(diào)
多個(gè)異步函數(shù)同步處理
異步依賴異步回調(diào)
封裝統(tǒng)一的入口辦法或者錯(cuò)誤處理

一、處理異步回調(diào)

Promise 的基本用法，處理異步回調(diào)。

function Pro1(){
 return new Promise(function(resolve, reject) {
  setTimeout(function(){
   resolve('pro1')
  }, 300)
 })
}
//調(diào)用
Pro1()
.then(function(data){
 console.log(data) //pro1
})
.catch(function(err){
 throw new Error(err)
})

二、多個(gè)異步函數(shù)同步處理

有時(shí)候我們需要發(fā)送兩個(gè)ajax，希望他們能一起把數(shù)據(jù)返回，就可以采用下面的辦法。

function Pro1(){
 return new Promise(function(resolve, reject) {
  setTimeout(function(){
   resolve('pro1')
  }, 300)
 })
}
function Pro2(){
 return new Promise(function(resolve, reject) {
  setTimeout(function(){
   resolve('pro2')
  }, 300)
 })
}
//調(diào)用
var Pro = Promise.all([Pro1(), Pro2()]);
Pro
.then(function(data){
 console.log(data[0], data[1]) //Pro1 Pro2
})
.catch(function(err){
 throw new Error(err)
})

三、異步依賴異步回調(diào)

有些場(chǎng)景是一個(gè)異步依賴另一個(gè)異步的返回值的，就可以采用下面的用法。

比如：用一個(gè)訂單號(hào)異步取到訂單詳情，再用訂單詳情里的商品Id獲取到商品詳情。

function Pro1(orderId){
 return new Promise(function(resolve, reject) {
  setTimeout(function(){
   var orderInfo = {
    orderId: orderId,
    productIds: ['123', '456']
   }
   resolve(orderInfo.productIds)
  }, 300)
 })
}
function Pro2(productIds){
 return new Promise(function(resolve, reject) {
  setTimeout(function(){
   var products = productIds.map(function(productId){
    return {
     productId: productId,
     name: '衣服'
    }
   })
   resolve(products)
  }, 300)
 })
}
//調(diào)用

Pro1('abc123')
.then(function(productIds){
 console.log('商品id',productIds) 
 return Pro2(productIds)
})
.then(function(products){
 console.log('商品詳情',products) 
})
.catch(function(err){
 throw new Error(err)
})

四、封裝統(tǒng)一的入口辦法或者錯(cuò)誤處理

錯(cuò)誤處理

function ErrorHandler(promiseObj, rejectOrResOrCallback){
 return promiseObj.then(null, function(err){
 if(!err)
 })
}

總結(jié)

以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來一定的幫助，如果有疑問大家可以留言交流，謝謝大家對(duì)創(chuàng)新互聯(lián)的支持。

文章名稱：Javascript中Promise的四種常用方法總結(jié)
本文鏈接：http://muchs.cn/article34/pgdose.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供建站公司、做網(wǎng)站、Google、企業(yè)網(wǎng)站制作、網(wǎng)站維護(hù)、定制開發(fā)

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

猜你還喜歡下面的內(nèi)容