一、背景

大家都知道nodejs很快，為什么會(huì)這么快呢，原因就是node采用異步回調(diào)的方式來(lái)處理需要等待的事件，使得代碼會(huì)繼續(xù)往下執(zhí)行不用在某個(gè)地方等待著。但是也有一個(gè)不好的地方，當(dāng)我們有很多回調(diào)的時(shí)候，比如這個(gè)回調(diào)執(zhí)行完需要去執(zhí)行下個(gè)回調(diào)，然后接著再執(zhí)行下個(gè)回調(diào)，這樣就會(huì)造成層層嵌套，代碼不清晰，很容易進(jìn)入“回調(diào)監(jiān)獄”，就容易造成下邊的例子：

async(1, function(value){
 async(value, function(value){
 async(value, function(value){
  async(value, function(value){
  async(value, function(value){
   async(value, final);
  });
  });
 });
 });
});

這樣的寫(xiě)法會(huì)讓人崩潰，那么有什么辦法可以解決這個(gè)問(wèn)題呢，或者有其他別的寫(xiě)法嗎？答案是有的，es6新出的promise對(duì)象已經(jīng)es7的async await都可以解決這個(gè)問(wèn)題，當(dāng)然這里先介紹promise對(duì)象，es7的async await將在后邊的文章中分享。下邊將來(lái)介紹Promise對(duì)象。

二、簡(jiǎn)介

Promise，他是一個(gè)對(duì)象，是用來(lái)處理異步操作的，可以讓我們寫(xiě)異步調(diào)用的時(shí)候?qū)懫饋?lái)更加優(yōu)雅，更加美觀便于閱讀。顧名思義為承諾、許諾的意思，意思是使用了Promise之后他肯定會(huì)給我們答復(fù)，無(wú)論成功或者失敗都會(huì)給我們一個(gè)答復(fù)，所以我們就不用擔(dān)心他跑了哈哈。所以，Promise有三種狀態(tài)：pending（進(jìn)行中），resolved（完成），rejected（失敗）。只有異步返回的結(jié)構(gòu)可以改變其狀態(tài)。所以，promise的過(guò)程一般只有兩種：pending->resolved或者pending->rejected。

promise對(duì)象還有一個(gè)比較常用的then方法，用來(lái)執(zhí)行回調(diào)函數(shù)，then方法接受兩個(gè)參數(shù)，第一個(gè)是成功的resolved的回調(diào)，另一個(gè)是失敗rejected的回調(diào)，第二個(gè)失敗的回調(diào)參數(shù)可選。并且then方法里也可以返回promise對(duì)象，這樣就可以鏈?zhǔn)秸{(diào)用了。接下來(lái)上代碼:

var Pro = function (time) {
   //返回一個(gè)Promise對(duì)象
   return new Promise(function (resolve, reject) {
    console.log('123');
    //模擬接口調(diào)用
    setTimeout(function () {
     //這里告訴Promise 成功了，然后去執(zhí)行then方法的第一個(gè)函數(shù)
     resolve('成功返回');
    }, time);
   })
  };
  (function(){
   console.log('start');
   Pro(3000)
   .then(function(data){
    console.log(data);
    return Pro(5000);})
   .then(function(data){
    console.log(data);
    console.log('end');
   })
  })();

上邊代碼中，定義了一個(gè)Pro變量，然后把一個(gè)匿名函數(shù)賦給他，函數(shù)返回一個(gè)Promise對(duì)象，然后對(duì)象里邊接收一個(gè)函數(shù)，分別把resolve跟reject方法當(dāng)參數(shù)傳進(jìn)去，用setTimeOut來(lái)模擬異步請(qǐng)求，當(dāng)執(zhí)行resolve方法后就會(huì)調(diào)用then方法的一個(gè)函數(shù)。結(jié)果如下：

三、Promise 的api　

1、Promise.resolve()
2、Promise.reject()
3、Promise.prototype.then()
4、Promise.prototype.catch()
5、Promise.all() // 所有的都有完成，相當(dāng)于 且
6、Promise.race() // 完成一個(gè)即可，相當(dāng)于 或

1、Promise.resolve()的作用將現(xiàn)有對(duì)象轉(zhuǎn)為Promise對(duì)象resolvedl;Promise.resolve('test')==new Promise(resolve=>resolve('test'))

2、Promise.reject()也是返回一個(gè)Promise對(duì)象,狀態(tài)為rejected；

3、then方法上邊已經(jīng)做介紹，這里就不再介紹。

4、catch():發(fā)生錯(cuò)誤的回調(diào)函數(shù)。

5、Promise.all()適合用于所有的結(jié)果都完成了才去執(zhí)行then（）成功的操作。舉個(gè)例子：

let p1 =new Promise(function(resolve,reject){
   resolve(1);
  });
  let p2 = new Promise(function(resolve,reject){
   resolve(2);
  });
  let p3 = new Promise(function(resolve,reject){
   resolve(3);
  });
  Promise.all([p1, p2, p3]).then(function (results) {
   console.log('success:'+results);
  }).catch(function(r){
   console.log("error");
   console.log(r);
  });

最后輸出：

6、Promise.race()的作用也是同時(shí)執(zhí)行多個(gè)實(shí)例，只要有一個(gè)實(shí)例改變狀態(tài)，Promise就改為那個(gè)實(shí)例所改變的狀態(tài)；

四、例子

var Pro = function () {
   //返回一個(gè)Promise對(duì)象
   return new Promise(function (resolve, reject) {
    //模擬接口調(diào)用
    setTimeout(function () {
     resolve(true);
    }, 1000);
   })
  };
  var Pro2 = function () {
   //返回一個(gè)Promise對(duì)象
   return new Promise(function (resolve, reject) {
    //模擬接口調(diào)用
    setTimeout(function () {
     resolve('Pro2成功執(zhí)行');
    }, 1000);
   })
  };
  
  Pro().then(function(data){
   var val = data;
   console.log(val)
   if (val) {
    console.log(1111)
    return Pro2()
   }
   
  }).then(function(data1){
   console.log(data1)
  })

輸出：

這樣就可以用then方法可以實(shí)現(xiàn)鏈?zhǔn)秸{(diào)用了。

以上這篇淺談js promise看這篇足夠了就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

最新評(píng)論