前言

今天就簡單總結一下promise的用法，在用promise之前，我們要先了解一下什麼promise，這個東西是用來幹什麼的？

通俗易懂的講，promise其實就是一個建構函式，是用來解決非同步操作的，我們平時其實還是會用到挺多的，比如我們經常會巢狀一層層的函式

step1(function (value1) {

  step2(value1, function(value2){

    step3(value2,function(value3) {

      step4(value3,function(value4) {

        // ...

      });

    });

  });

});
 

傳統方法我們會這樣寫，但是如果用promise就會簡單很多，如下：

(new Promise(step1))

  .then(step2)

  .then(step3)

  .then(step4);

基本用法

   new Promise(function (resolve,reject) {
        console.log('promise準備階段');
        
        resolve("成功！");
        reject("失敗！");
    })

輸出結果：

promise準備階段

注意： promise總共有三個狀態，準備狀態，成功狀態，失敗狀態，這裡面promise是剛剛定義，所以是進入準備狀態，因為每new一個promise都會進入準備狀態，我們還沒有執行就進入準備狀態了，所以，我們經常用一個函式給他包起來

  function asyncPro(){
        return new Promise(function (resolve,reject) {
            console.log('promise準備階段');
            resolve("成功！");
            reject("失敗！");
        });
    }
    asyncPro();

輸出結果：

promise準備階段

這裡，只有呼叫asyncPro()，promise才開始new一個

上面，大家應該也注意到了在構建promise時，有兩個引數，resolve和reject，接下來我們重點講下這兩個

1. resolve講解

resolve其實就是非同步操作成功時候執行的函式，當我們建立一個建構函式之後，成功執行之後，我們傳遞的引數要如何獲取呢？

function asyncPro(){
        return new Promise(function (resolve,reject) {
            console.log('promise準備階段');
            resolve("成功！");
            reject("失敗！");
        });
    }
    asyncPro().then(function (msg) {
        console.log(msg);
    });

輸出結果：

promise準備階段
成功！

注意： .then就是獲取成功時候獲取的資料

2. reject講解

上面resolve是成功的時候回撥，那麼reject就是失敗之後的回撥

   function asyncPro(){
        return new Promise(function (resolve,reject) {
            console.log('promise準備階段');
            resolve("成功！");
            reject("失敗！");
        });
    }
    asyncPro().then(function (msg) {
        console.log(msg);
    }).catch(function (msg) {
        console.log(msg);
    });

這個一般只有在操作異常的時候才會回撥，.catch就是reject的回撥，一般我們可以不寫

好了，上面主要簡單瞭解一下promise，接下來用一個例子來總結一下

  function asyncPro(msg){
        return new Promise(function (resolve,reject) {
            console.log(msg+'：promise準備階段');
            resolve(msg+'成功！');
            reject(msg+"失敗！");
        });
    }
    asyncPro('第一步').then(function (msg) {
        console.log(msg);
        return asyncPro('第二步');
    }).then(function (msg) {
        console.log(msg);
        return asyncPro('第三步');
    }).then(function(msg){
        console.log(msg);
    });

輸出結果：

第一步：promise準備階段
第一步成功！
第二步：promise準備階段
第二步成功！
第三步：promise準備階段
第三步成功！

從上面程式碼可以看出，promise對多層巢狀時有很大的幫助，可以對程式碼很好的維護，當第一步執行完畢，要執行第二步的時候，return出第二步的函式，在下一個then中獲取返回的資料，以此類推。

以上是對promise用法簡單總結，後續會再補充。