Promise.all: ordine dei valori risolti

Guardando MDN sembra che il valuespassato al then()callback di Promise.all contenga i valori nell'ordine delle promesse. Per esempio:

var somePromises = [1, 2, 3, 4, 5].map(Promise.resolve);
return Promise.all(somePromises).then(function(results) {
  console.log(results) //  is [1, 2, 3, 4, 5] the guaranteed result?
});

Qualcuno può citare una specifica affermando in quale ordine valuesdovrebbe essere?

PS: L'esecuzione di un codice del genere ha mostrato che questo sembra essere vero anche se ovviamente non è una prova - potrebbe essere stata una coincidenza.

In breve, l'ordine viene preservato .

Seguendo le specifiche a cui si è collegati, Promise.all(iterable)prende un iterable(ovvero un oggetto che supporta l' Iteratorinterfaccia) come parametro e successivamente chiama PerformPromiseAll( iterator, constructor, resultCapability)con esso, in cui quest'ultimo passa sopra iterableusando IteratorStep(iterator).
Ciò significa che se l'iterabile in cui si passa Promise.all()è strettamente ordinato, verranno comunque ordinati una volta passati.

La risoluzione viene implementata tramite Promise.all() Resolvedove ogni promessa risolta ha uno [[Index]]slot interno , che segna l'indice della promessa nell'input originale.

Tutto ciò significa che l'output è rigorosamente ordinato come input fintanto che l'ingresso è rigorosamente ordinato (ad esempio un array).

Puoi vederlo in azione nel violino qui sotto (ES6):

// Used to display results
const write = msg => {
  document.body.appendChild(document.createElement('div')).innerHTML = msg;
};

// Different speed async operations
const slow = new Promise(resolve => {
  setTimeout(resolve, 200, 'slow');
});
const instant = 'instant';
const quick = new Promise(resolve => {
  setTimeout(resolve, 50, 'quick');
});

// The order is preserved regardless of what resolved first
Promise.all([slow, instant, quick]).then(responses => {
  responses.map(response => write(response));
});

Come già indicato nelle risposte precedenti, Promise.allaggrega tutti i valori risolti con un array corrispondente all'ordine di input delle Promesse originali (vedere Aggregating Promises ).

Tuttavia, vorrei sottolineare che l'ordine è conservato solo dal lato client!

Per lo sviluppatore sembra che le Promesse siano state rispettate nell'ordine, ma in realtà le Promesse vengono elaborate a velocità diverse. Questo è importante sapere quando lavori con un back-end remoto perché il back-end potrebbe ricevere le tue promesse in un ordine diverso.

Ecco un esempio che dimostra il problema utilizzando i timeout:

Promise.all

const myPromises = [
  new Promise((resolve) => setTimeout(() => {resolve('A (slow)'); console.log('A (slow)')}, 1000)),
  new Promise((resolve) => setTimeout(() => {resolve('B (slower)'); console.log('B (slower)')}, 2000)),
  new Promise((resolve) => setTimeout(() => {resolve('C (fast)'); console.log('C (fast)')}, 10))
];

Promise.all(myPromises).then(console.log)

Nel codice mostrato sopra, vengono date tre Promesse (A, B, C) Promise.all. Le tre promesse vengono eseguite a velocità diverse (C è la più veloce e B la più lenta). Ecco perché le console.logdichiarazioni delle Promesse si presentano in questo ordine:

C (fast) 
A (slow)
B (slower)

Se le promesse sono chiamate AJAX, un back-end remoto riceverà questi valori in questo ordine. Ma dal lato client Promise.allgarantisce che i risultati siano ordinati in base alle posizioni originali myPromisesdell'array. Ecco perché il risultato finale è:

['A (slow)', 'B (slower)', 'C (fast)']

Se vuoi garantire anche l'effettiva esecuzione delle tue Promesse, allora avrai bisogno di un concetto come una coda di Promessa. Ecco un esempio usando la coda-p (attenzione, è necessario racchiudere tutte le promesse nelle funzioni):

Coda di promessa sequenziale

const PQueue = require('p-queue');
const queue = new PQueue({concurrency: 1});

// Thunked Promises:
const myPromises = [
  () => new Promise((resolve) => setTimeout(() => {
    resolve('A (slow)');
    console.log('A (slow)');
  }, 1000)),
  () => new Promise((resolve) => setTimeout(() => {
    resolve('B (slower)');
    console.log('B (slower)');
  }, 2000)),
  () => new Promise((resolve) => setTimeout(() => {
    resolve('C (fast)');
    console.log('C (fast)');
  }, 10))
];

queue.addAll(myPromises).then(console.log);

Risultato

A (slow)
B (slower)
C (fast)

['A (slow)', 'B (slower)', 'C (fast)']

Sì, i valori in resultssono nello stesso ordine di promises.

Si potrebbe citare le specifiche ES6Promise.all , anche se è un po 'contorto a causa dell'API iteratore usato e del costruttore di promesse generiche. Tuttavia, noterai che ogni callback del resolver ha un [[index]]attributo che viene creato nell'iterazione della matrice promessa e utilizzato per impostare i valori sulla matrice dei risultati.