js Promise學習

js Promise

• promise入參爲兩個
  
  • 成功時的執行 resolve
  • 失敗時的執行 reject

• promise的狀態

  • 肯定（fulfilled） 該 Promise 對應的操作成功了
  • 否定（rejected） 該 Promise 對應的操作失敗了
  • 等待（pending） 還沒有得到肯定或者否定結果，進行中
  • 結束（settled） 已經肯定或者否定了

• promise必須實現then方法，只有實現then方法纔可以取出promise裏面的值

    var promise = new Promise(function(resolve, reject) {
        resolve(1);
    });

    promise.then(function(val) {
        console.log(val); // 1
    });

• then方法返回的不是值，而是promise，此promise需要用then方法實現之後纔可以取出其中的值

    var promise = new Promise(function(resolve, reject) {
        resolve(1);
    });

    var aa = promise.then(function(val) {
        console.log(val); // 1
        return val + 2;
    });
    aa.then(function(data){
        console.log(data);// 3
    });
    console.log(aa);//obj

此時的aa是一個promise，狀態是pending

• 鏈接調用；promise的鏈接調用功能是非常強大，並且代碼可讀性也是相當的高

    var promise = new Promise(function(resolve, reject) {
        resolve(1);
    });

    promise.then(function(val) {
        console.log(val); // 1
        return val + 2;
    }).then(function(data){
        console.log(data);// 3
    });

• 執行順序；promise執行在後；

    var promise = new Promise(function(resolve, reject) {
        resolve(1);
    });

    promise.then(function(val) {
        console.log(val); // 1
    });

    console.log("first");

以上代碼會先輸入first，然後再輸出1

• 如何取promise當中的值

  var promise = new Promise(function(resolve, reject) {
      resolve(1);
  });

  var aa = promise.then(function(val) {
      var res = {},
          age = val + 2;
      res.age = age;
      return res;
  }).then(function(data) {
      data.name = "zhangsan";
      return data;
  }).then(function(data) {
      if (data.name == "zhangsan" && data.age == 3) {
          data.address = "Hangzhou China";
      }
      return data;
  });

  aa.then(function(data) {
      console.log(data);
  })

//返回結果：
[object Object] {
  address: "Hangzhou China",
  age: 3,
  name: "zhangsan"
}

每一次實現then方法的時候，都需要將data全部組裝返回，這樣纔可以保證最後得到的值是全部的data

• 參考
  JavaScript Promises；