> For the complete documentation index, see [llms.txt](https://lochiwei.gitbook.io/web/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lochiwei.gitbook.io/web/js/async/promise/in-parallel.md).

# Promises in parallel

[JS](/web/js.md) ⟩ [async](/web/js/async.md) ⟩ [Promise](/web/js/async/promise.md) ⟩ in parallel

{% tabs %}
{% tab title="⭐️ 重點" %}
{% hint style="warning" %}
[`Promise.all()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all) 

* will <mark style="color:red;">**reject immediately**</mark> upon <mark style="color:yellow;">**any**</mark> of the input promises rejecting.
  {% endhint %}

{% hint style="success" %}
[`Promise.allSettled()`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/allSettled)  ([⭐️ ES2020](/web/js/feature/es2020.md))

* will wait for <mark style="color:yellow;">**all input promises**</mark> to <mark style="color:orange;">**complete**</mark>, <mark style="color:red;">**regardless of whether or not one rejects**</mark>.&#x20;
* will <mark style="color:yellow;">**always**</mark> return the <mark style="color:yellow;">**final result**</mark> of <mark style="color:yellow;">**every**</mark> promise and function from the input iterable. (**order is preserved**)
  {% endhint %}
  {% endtab %}

{% tab title="🔴 主題" %}

* [await promises](/web/js/async/await/promises.md) (in parallel or in series)
  {% endtab %}

{% tab title="💈範例" %}

```javascript
// rejected if any of the input Promises are rejected,
// otherwise, fulfilled with an array of values of each Promise.
Promise.all(
    // array of URLs -> array of Promises
    urls.map(url => fetch(url).then(response => response.text())
).then(
    texts => handle(texts)    // do something with array of strings
)
```

:floppy\_disk: replit：[Promise.all()](https://replit.com/@pegasusroe/Promiseall#index.js)

```javascript
// custom Promise
const promiseFoo = new Promise((resolve, reject) => {
    setTimeout(resolve, 2000, 'foo');
    //                        ╰───╯ <---- parameter to `resolve`
});

// ⭐ Promise.all()
// - rejected if any is rejected
// - fulfilled (with array of values) if all are fulfilled
Promise.all([
    Promise.resolve(3),
    42,                     // non-Promise value is OK
    promiseFoo
]).then(values => {
    console.log(values);    // [ 3, 42, 'foo' ]
});

// ⭐ Promise.allSettled()
// - always fulfilled with array of outcomes (objects)
Promise.allSettled([
    Promise.resolve(1),
    Promise.reject('bad boy'),
    3,
]).then(results => {
    results.forEach(result => console.log(result));
    // { status: 'fulfilled',  value: 1         }    // ⭐ with `value`
    // { status: 'rejected' , reason: 'bad boy' }    // ⭐ with `reason`
    // { status: 'fulfilled',  value: 3         }
});
```

:floppy\_disk: replit：[Promise.race()](https://replit.com/@pegasusroe/Promiserace#index.js)

```javascript
// ⭐ Promise.race()
// - settled immediately if any is settled.
Promise.race([
    new Promise(resolve => setTimeout(resolve, 500, 'one')),
    new Promise(resolve => setTimeout(resolve, 200, 'two')),    // resolve faster
]).then(value => {
    console.log(value);    // 'two'
});
```

{% endtab %}

{% tab title="📘 手冊" %}

* [Promise.all()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/all) - rejected <mark style="color:red;">**immediately**</mark> if any rejetcted, fulfilled if **all fulfilled**.
* [Promise.allSettled()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/allSettled) - a [Promise](/web/js/async/promise.md) that will <mark style="color:yellow;">**always**</mark> be <mark style="color:green;">**fulfilled**</mark> (with an array of outcome objects) when **all settled**.
* [Promise.race()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/race) - settled <mark style="color:red;">**immediately**</mark> if any is settled.
  {% endtab %}

{% tab title="👥 相關" %}

* [await promises](/web/js/async/await/promises.md)
  {% endtab %}
  {% endtabs %}