Javascript中怎使用Promise？使用Primise的常用方法總結(jié)！

有學(xué)習(xí)過前端語(yǔ)言的小伙伴們都知道 JavaScript，它可以為我們網(wǎng)頁(yè)的實(shí)現(xiàn)提供了不少的幫助，那么對(duì)于 JavaScript 這個(gè)語(yǔ)言，小編今天來說說在“Javascript怎使用Promise？”這個(gè)問題。下面是小編整理的相關(guān)內(nèi)容和資料，希望對(duì)大家的學(xué)習(xí)和了解有所幫助！

方法一：處理異步回調(diào)

對(duì)于 ?JavaScript? 中的 ?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ù)同步處理

那么在開發(fā)中有時(shí)候我們需要發(fā)送兩個(gè) ?Ajax? ，我們希望他們可以能夠?qū)?shù)據(jù)返回，我們可以采用下面這個(gè)方法代碼如下所示：

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)

在這個(gè)方法中我們使用這個(gè)方法可以借鑒下面這串代碼進(jìn)行參考，代碼如下所示：

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é)：

對(duì)于 JavaScript 中的 Primise 常用的場(chǎng)景就是這些了，更多有關(guān)于 JavaScript 相關(guān)的內(nèi)容我們都可以在 W3Cschool 中進(jìn)行學(xué)習(xí)和了解。當(dāng)然如果你有其他更好的想法也可以和大家一同分享你的想法。希望以上的分享對(duì)大家有所幫助。