本文實例講述了ES6基礎(chǔ)之 Promise 對象用法。分享給大家供大家參考，具體如下：

Promise 對象

1.Promise對象是ES6對異步編程的一種解決方案，它有以下兩個特點：

• Promise對象代表一個異步操作，它只有三種狀態(tài)：Pending（進(jìn)行中）、Resolved（已完成，又稱 Fulfilled）和Rejected（已失敗），并且該狀態(tài)不會受外界的影響
• Promise對象的狀態(tài)改變，只有兩種可能：從 Pending 變?yōu)?Resolved 或者從 Pending 變?yōu)?Rejected，并且一旦狀態(tài)改變，就不會再變，任何時候都可以得到這個結(jié)果

2.Promise對象的一些缺點：

一旦新建了一個Promise對象，就會立即執(zhí)行，并且無法中途取消

let promise = new Promise(function(resolve, reject) {console.log('Promise');resolve();});// Promise

如果不設(shè)置Promise對象的回調(diào)函數(shù)，Promise會在內(nèi)部拋出錯誤，不會反應(yīng)到外部，也就是在外部拿不到錯誤提示

如果Promise對象處于Pending狀態(tài)時，是無法得知捕獲進(jìn)展到哪一個階段的（剛剛開始還是即將完成）

3.Promise對象是一個構(gòu)造函數(shù)，用來生成Promise實例，下面是創(chuàng)造了一個Promise實例的示例

let promise = new Promise(function(resolve, reject) { // ... to do if ( success ){  resolve(value);  //成功操作 } else {  reject(error);   //失敗操作 }});

ps：Promise 構(gòu)造函數(shù)接受一個函數(shù)作為參數(shù)，該函數(shù)的兩個參數(shù)分別是 resolve 和 reject ，分別用來處理成功和失敗的回調(diào)；

4.Promise實例生成以后，可以用 then 方法分別指定 Resolved 狀態(tài)和 Reject 狀態(tài)的回調(diào)函數(shù)；

promise.then(function(value) { // success}, function(error) { // failure});

ps：then方法可以接受兩個回調(diào)函數(shù)作為參數(shù)。第一個回調(diào)函數(shù)是Promise對象的狀態(tài)變?yōu)镽esolved時調(diào)用，第二個回調(diào)函數(shù)是Promise對象的狀態(tài)變?yōu)镽ejected時調(diào)用，其中，第二個函數(shù)是可選的；

5.resolve函數(shù)的參數(shù)除了正常的值以外，還可能是另一個 Promise 實例，表示異步操作的結(jié)果有可能是一個值，也有可能是另一個異步操作；

let promise1 = new Promise(function (resolve, reject) { // ...});let promise2 = new Promise(function (resolve, reject) { // ... resolve(p1);})

上面代碼表示一個異步操作的結(jié)果是返回另一個異步操作，promise1 的狀態(tài)就會傳遞給 promise2 , 如果 promise1 的狀態(tài)是Pending，那么 promise2 的回調(diào)函數(shù)就會等待promise1的狀態(tài)改變；如果promise1的狀態(tài)已經(jīng)是Resolved或者Rejected，那么promise2的回調(diào)函數(shù)將會立刻執(zhí)行;

6.Promise實例方法then返回的是一個新的Promise實例,因此可以采用鏈?zhǔn)綄懛?，即then方法后面再調(diào)用另一個then方法

let promise = new Promise(function (resolve, reject) { // ...})promise.then(function(res) {  return res.post;}).then(function(post) {  // ...});

ps：上例中依次指定了兩個回調(diào)函數(shù)，第一個回調(diào)函數(shù)完成以后，會將返回結(jié)果作為參數(shù)，傳入第二個回調(diào)函數(shù)，如果返回的是 Promise 對象（即有異步操作），這時后一個回調(diào)函數(shù)，就會等待該P(yáng)romise對象的狀態(tài)發(fā)生變化，才會被調(diào)用

let promise = new Promise(function (resolve, reject) { // ...})promise.then(function(res) {  return new Promise(/.../);}).then(function(res) {  // Resolved},function(error){  // Rejected});

7.Promise.prototype.catch 方法用于指定發(fā)生錯誤時的回調(diào)函數(shù)，不僅異步操作拋出錯誤（即狀態(tài)就會變?yōu)镽ejected），而且 then 方法指定的回調(diào)函數(shù)，如果運(yùn)行中拋出錯誤，也會被catch方法捕獲

let promise = new Promise(function(resolve, reject) {  throw new Error('test');}).catch(function(error) { console.log(error);});// Error: test

8.如果Promise狀態(tài)已經(jīng)變成Resolved，再拋出錯誤是無效的

let promise = new Promise(function(resolve, reject) { resolve('ok'); throw new Error('test');});promise .then(function(value) { console.log(value) }) .catch(function(error) { console.log(error) }); //ok

ps： 出現(xiàn)上述結(jié)果是由于 之前提到的 Promise 的狀態(tài)一旦改變，就永久保持該狀態(tài)，不會再變了，因此在 resolve 語句后面，再拋出錯誤，是不會被捕獲的

9.Promise 對象的錯誤具有“冒泡”性質(zhì)，會一直向后傳遞，直到被捕獲為止，因此建議總是使用catch方法，而不使用then方法的第二個參數(shù)，因為使用catch方法可以捕獲前面then方法執(zhí)行中的錯誤

// badpromise .then(function(data) {  // success }, function(err) {  // error });// goodpromise .then(function(data) { //cb  // success }) .catch(function(err) {  // error });

10.Promise.all方法用于將多個 Promise 實例，包裝成一個新的 Promise 實例，該方法接收一個 promise對象的數(shù)組作為參數(shù)，當(dāng)這個數(shù)組里的所有promise對象全部變?yōu)閞esolve或reject狀態(tài)的時候，它才會去調(diào)用 .then 方法。

var p1 = new Promise(function (resolve) {  setTimeout(function () {    resolve("Hello");  }, 3000);});var p2 = new Promise(function (resolve) {  setTimeout(function () {    resolve("World");  }, 1000);});Promise.all([p1, p2]).then(function (result) {  console.log(result);  // ["Hello", "World"]});

上面的例子模擬了傳輸兩個數(shù)據(jù)需要不同的時長，雖然 p2 的速度比 p1 要快，但是 Promise.all 方法會按照數(shù)組里面的順序?qū)⒔Y(jié)果返回，但 promise 本身并不是一個個的順序執(zhí)行的，而是同時開始、并行執(zhí)行的，可以利用這個特點處理需要多個回調(diào)返回后才能進(jìn)行的操作

11.Promise.race方法和Promise.all方法類似，也接收一個promise對象數(shù)組為參數(shù)，不同的是只要該數(shù)組中的 Promise 對象的狀態(tài)發(fā)生變化（無論是 resolve 還是 reject）該方法都會返回。

var p1 = new Promise(function (resolve) {setTimeout(function () {resolve("Hello");}, 3000);});var p2 = new Promise(function (resolve) {setTimeout(function () {resolve("World");}, 1000);});Promise.race([p1, p2]).then(function (result) {console.log(result);  // Wrold});

12.一般情況下我們都會使用 new Promise() 來創(chuàng)建promise對象，除此之外，可以使用 Promise.resolve 和 Promise.reject這兩個方法；

靜態(tài)方法Promise.resolve(value) 可以認(rèn)為是 new Promise() 方法的快捷方式

let promise = Promise.resolve('resolved');//等價于let promise = new Promise(function(resolve){resolve('resolved');});

上述的promise對象立即進(jìn)入確定（即resolved）狀態(tài)，并將 'resolved' 傳遞給后面then里所指定的 onFulfilled 函數(shù)。

Promise.resolve('resolved').then(function(value){console.log(value);});// resolved

Promise.reject(error)是和 Promise.resolve(value) 類似的靜態(tài)方法，是 new Promise() 方法的快捷方式。

let promise = Promise.reject(new Error("出錯了"));//等價于let promise = new Promise(function(resolve,reject){reject(new Error("出錯了"));});

上述 promise 對象通過then指定的 onRejected 函數(shù)，并將錯誤（Error）對象傳遞給這個 onRejected 函數(shù)

Promise.reject(new Error("fail!")).catch(function(error){console.error(error);});// Error : fail!

13.我們可以利用 Promise 應(yīng)用到我們實際開發(fā)中，下面舉幾個栗子

//圖片加載const preloadImage = function (path) { return new Promise(function (resolve, reject) {  var image = new Image();  image.onload = resolve(image);  image.onerror = function() {    reject(new Error('Could not load image at ' + path));  };  image.src = path; });}//文件讀取function reader (file) { return new Promise(function (resolve, reject) {  let reader = new FileReader();  reader.onload = function () {   resolve(reader);  };  reader.onerror = function() {    reject(new Error('Could not open the file ' + file));  };  if (!file.type || /^text///i.test(file.type)) {   reader.readAsText(file);  } else {   reader.readAsDataURL(file);  } })}

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具：http://tools.VeVB.COm/code/HtmlJsRun測試上述代碼運(yùn)行效果。

更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題：《javascript面向?qū)ο笕腴T教程》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計有所幫助。