實現 JavaScript 異步方法 Promise.all

mushang 發布于2019-08-21 12:03 / 693人閱讀

摘要：本次的任務假如。。。。。引擎發生了重大故障，方法變成了，為了拯救世界，需要開發一個模塊來解決此問題。實現首先要知道是什么是對異步編程的一種抽象。數組中任何一個為的話，則整個調用會立即終止，并返回一個的新的對象。

本次的任務

假如。。。。。

JavaScript v8 引擎發生了重大故障，Promise.all 方法變成了 undefined ，為了拯救 JavaScript 世界，需要開發一個模塊來解決此問題。

使用者需要在代碼入口處引入我們開發的模塊就可渡過此劫，但要求三個月后官方修改此版本，代碼無修改就能自動切換到官方版本。實現 Promise.all

首先要知道 Promise 是什么

promise 是對異步編程的一種抽象。它是一個代理對象，代表一個必須進行異步處理的函數返回的值或拋出的異常。

promise 最早是在 commonjs 社區提出來的，當時提出了很多規范。比較接受的是 promise/A 規范。后來人們在這個基礎上。提出了 promise/A+規范，也就是實際上的業內推行的規范。ECMAScript 6.0 也是采用的這種規范。

英文版：https://promisesaplus.com/

中文版：【翻譯】Promises/A+規范

上面的規范中主要定義的 then 的實現方式，也就是只規定了 Promise 的核心， Promise.race，Promise.all 等 api 沒有規定。

ECMAScript 6.0 Promise.all 規范

Node.js 兼容性如下圖點擊查看在線版

特點

Promise 不需要編譯器/解釋器的支持

將來可能成為主流的 async-await，以及曾經火過一把的 generator + co，這些都是需要編譯器或者解釋器級別的支持才能使用。

而 Promise，是完全可以利用語言已有特性，作為一個庫來實現！即使在非常原始的JS運行環境，你也可以自己實現一個 Promise，而不需要等待其他人的幫助。

Promise 是語言無關的

Promise 還是獨立于語言的，如果你要給另外一種編程語言實現 Promise，只要照葫蘆畫瓢就行了。

promise 怎么用

請看這里，阮一峰的 ECMAScript 6 入門 Promise

實現 Promise.all

Promise.all 接收一個 promise 對象的數組作為參數，當這個數組里的所有 promise 對象全部變為resolve或有 reject 狀態出現的時候，它才會去調用 .then 方法,它們是并發執行的。

Promise.all 簡介

Promise.all(promiseArray) 方法是 Promise 對象上的靜態方法，該方法的作用是將多個 Promise 對象實例包裝，生成并返回一個新的 Promise 實例。

參數：promiseArray，是一個 Promise 實例數組

var p1 = Promise.resolve(1),
    p2 = Promise.resolve(2),
    p3 = Promise.resolve(3);
Promise.all([p1, p2, p3]).then(function (results) {
    console.log(results);  // [1, 2, 3]
});

在上面的方法中，promise 數組中所有的 promise 實例都變為resolve 的時候，該方法才會返回，并將所有結果傳遞 results 數組中。promise 數組中任何一個 promise 為 reject 的話，則整個 Promise.all 調用會立即終止，并返回一個 reject 的新的 promise 對象。reject 使用示例如下：

var p1 = Promise.resolve(1),
    p2 = Promise.reject(2),
    p3 = Promise.resolve(3);
Promise.all([p1, p2, p3]).then(function (results) {
    //then方法不會被執行
    console.log(results);
}).catch(function (e){
    //catch方法將會被執行，輸出結果為：2
    console.log(2);
});

總結 promise.all 的特點

1、接收一個 Promise 實例的數組或具有 Iterator 接口的對象，

2、如果元素不是 Promise 對象，則使用 Promise.resolve 轉成 Promise 對象

3、如果全部成功，狀態變為 resolved，返回值將組成一個數組傳給回調

4、只要有一個失敗，狀態就變為 rejected，返回值將直接傳遞給回調
all() 的返回值也是新的 Promise 對象

實現 Promise.all 方法

function promiseAll(promises) {
  return new Promise(function(resolve, reject) {
    if (!isArray(promises)) {
      return reject(new TypeError("arguments must be an array"));
    }
    var resolvedCounter = 0;
    var promiseNum = promises.length;
    var resolvedValues = new Array(promiseNum);
    for (var i = 0; i < promiseNum; i++) {
      (function(i) {
        Promise.resolve(promises[i]).then(function(value) {
          resolvedCounter++
          resolvedValues[i] = value
          if (resolvedCounter == promiseNum) {
            return resolve(resolvedValues)
          }
        }, function(reason) {
          return reject(reason)
        })
      })(i)
    }
  })
}

npms 地址 promise-all-simple

參考

自己動手實現ES6 Promise

JavaScript Promise迷你書

Promise對象Promise.all()方法的使用

深入 Promise(一)——Promise 實現詳解

深入理解 Promise (上)

擴展閱讀

深入淺出js（Node.js）異步流程控制

云服務器 GPU云服務器 javascript實現方法實現異步調用 javascript異步函數 JavaScript異步機制

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/87389.html

javascript異步之Promise.all()、Promise.race()、Promise.

摘要：的執行與狀態無關當得到狀態不論成功或失敗后就會執行，原文鏈接參考鏈接對象同期異步系列文章推薦談一談javascript異步javascript異步中的回調javascript異步與promisejavascript異步之Promise.resolve()、Promise.reject()javascript異步之Promise then和catchjavascript異步之async...

clasnake 2019-08-23 14:53 評論0 收藏0
現代JS中的流程控制：詳解Callbacks 、Promises 、Async/Await

摘要：控制臺將顯示回調地獄通常，回調只能由一個異步函數調用。更多資源使更友好規范使用異步函數簡化異步編碼旅程異步編程是一項在中無法避免的挑戰。 JavaScript經常聲稱是_異步_。那是什么意思？它如何影響發展？近年來這種方法有何變化？請思考以下代碼： result1 = doSomething1(); result2 = doSomething2(result1); 大多數語言都處理每...

shadowbook 2019-08-29 16:29 評論0 收藏0
現代JS中的流程控制：詳解Callbacks 、Promises 、Async/Await

摘要：控制臺將顯示回調地獄通常，回調只能由一個異步函數調用。更多資源使更友好規范使用異步函數簡化異步編碼旅程異步編程是一項在中無法避免的挑戰。 JavaScript經常聲稱是_異步_。那是什么意思？它如何影響發展？近年來這種方法有何變化？請思考以下代碼： result1 = doSomething1(); result2 = doSomething2(result1); 大多數語言都處理每...

oujie 2019-08-23 11:28 評論0 收藏0
現代JS中的流程控制：詳解Callbacks 、Promises 、Async/Await

摘要：控制臺將顯示回調地獄通常，回調只能由一個異步函數調用。更多資源使更友好規范使用異步函數簡化異步編碼旅程異步編程是一項在中無法避免的挑戰。 JavaScript經常聲稱是_異步_。那是什么意思？它如何影響發展？近年來這種方法有何變化？請思考以下代碼： result1 = doSomething1(); result2 = doSomething2(result1); 大多數語言都處理每...

anquan 2019-08-02 11:19 評論0 收藏0
JavaScript Promise啟示錄

摘要：近幾年隨著開發模式的逐漸成熟，規范順勢而生，其中就包括提出了規范，完全改變了異步編程的寫法，讓異步編程變得十分的易于理解。最后，是如此的優雅但也只是解決了回調的深層嵌套的問題，真正簡化異步編程的還是，在端，建議考慮。本篇，簡單實現一個promise，主要普及promise的用法。一直以來，JavaScript處理異步都是以callback的方式，在前端開發領域callback機制...

Juven 2019-08-21 12:16 評論0 收藏0