Promise

1 Promise的狀況
1.1 Promise對象有三種狀況:
pending 初始狀況,既不是resolved也不是rejected;
resolved 勝利。此時挪用onFulfilled;
rejected 失利。此時挪用onRejected;
resolved和rejected都能夠示意為settled.最初Promise為pending狀況,在實行後轉為settled狀況,而settled狀況分為兩種:在勝利後轉為resolved,實行.then(onFulfilled)要領;在失利後轉為reject,實行.then(onRejected)或.catch(onRejected),舉行異步操縱,再返回Promise對象。

2 建立Promise的基礎語法:
2.1 運用new來挪用Promise的組織器舉行實例化

var promise = new Promise(function(resolve, reject) {
  if(...) {
   resolve(data);
  } else {
   reject(new Error('error'));
  }
});
注重:new Promise(func)時,func會馬上實行。

e.g.1
new Promise(function(resolve, reject) {
  console.log('#1');
  resolve(1);//實行完這行,內部屬性[[PromiseStatus]]和[[PromiseValue]]都變了,分別由pending -> resolved, undefined -> 1
  console.log('#2');
}).then(function() {
  console.log('#3');
}); // #1 #2 #3 先實行主線程實行棧中的代碼

e.g.2
new Promise(function(resolve, reject) {
  console.log('#1');
  reject(4);//實行完這行,內部屬性[[PromiseStatus]]和[[PromiseValue]]都變了,分別由pending -> rejected, undefined -> 4
  console.log('#2');
}); // #1 #2 報錯:Uncaught (in promise) Error: reject(…) 由於背面沒有then/catch供應的onRejected回調,非常沒有被消耗掉

P.S. reject的參數可所以恣意範例的,但平常都傳入 Error對象示意毛病緣由

2.2 Promise.resolve & Promise.reject
Promise.resolve & Promise.reject能夠認為是new Promise()的快捷方式,返回值也是一個promise對象,所以能夠舉行鏈式挪用。

Promise.resolve(4); // Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: 4}
等同於以下代碼
new Promise(function(resolve) {
  resolve(4);
});
 
Promise.reject(4); // Promise {[[PromiseStatus]]: "rejected", [[PromiseValue]]: 4}
//等同於以下代碼
new Promise(function(resolve, reject) {
  reject(4);
})

3 Promise.prototype.then(function onFulfilled() {…}, function onRejected() {…})
當resolve(勝利)時,會挪用onFulfilled函數;reject(失利)時,會挪用onRejected函數。若只想處置懲罰非常情況的函數,可promise.then(undefined, onRejected),固然更好的挑選是用promise.catch()來處置懲罰。兩者結果雷同。

promise.then(function (value) {
  console.log(value); 
}).catch(function (error) {
  console.log(error);
});
//等同於以下情勢
promise.then(function (value) {
  console.log(value);
}, function (error) {
  console.log(error);
});
 
e.g.3
new Promise(function(resolve, reject) {
  resolve(2);
}); // Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: 2}

e.g.4
new Promise(function(resolve, reject) {
  resolve(2);
}).then(function() {
  console.log('ha');
}); // ha Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: undefined}

e.g.5
new Promise(function(resolve, reject) {
  resolve(2);
}).then(function() {
  return 'haha';
}); // Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: 'haha'}

e.g.6
new Promise(function(resolve, reject) {
  reject(2);
}); // Promise {[[PromiseStatus]]: "rejected", [[PromiseValue]]: 2} 報錯:Uncaught (in promise) 2

e.g.7
new Promise(function(resolve, reject) {
  reject(2);
}).then(function() {
}, function() {
  console.log('ha');
}); // ha Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: undefined}

e.g.8
new Promise(function(resolve, reject) {
  reject(2);
}).then(function() {
}, function() {
  return 'haha';
}); // Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: "haha"}

注重:要想挪用then以後返回的promise對象的[[PromiseValue]]不是undefined,必需return一個值;
e.g.7和e.g.8返回對象的狀況是 resolved,而不是 rejected.
    原文作者:小被子
    原文地址: https://segmentfault.com/a/1190000014542578
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞