Promessas e Async/Await em JavaScript: O Guia Definitivo

Domine promessas e async/await em JavaScript com este guia abrangente! Aprenda tudo o que você precisa saber sobre o uso de promessas e async/await em JavaScript.

Então vamos começar.

Por que usar promessas em JavaScript?

O ES6 introduziu promessas como uma implementação nativa. Antes do ES6, usávamos callbacks para lidar com operações assíncronas.

Vamos entender o que são callbacks e qual problema relacionado a callbacks é resolvido por promessas.

Digamos que temos uma lista de postagens e seus respectivos comentários, assim:

const posts = [
  { post_id: 1, post_title: 'First Post' },
  { post_id: 2, post_title: 'Second Post' },
  { post_id: 3, post_title: 'Third Post' },
];

const comments = [
  { post_id: 2, comment: 'Great!'},
  { post_id: 2, comment: 'Nice Post!'},
  { post_id: 3, comment: 'Awesome Post!'},
];

Agora, escreveremos uma função para obter uma postagem passando o ID da postagem. Se a postagem for encontrada, recuperaremos os comentários relacionados a essa postagem.

const getPost = (id, callback) => {
 const post = posts.find( post => post.post_id === id);
 if(post) {
   callback(null, post);
 } else {
   callback("No such post found", undefined);
 }
};

const getComments = (post_id, callback) => {
 const result = comments.filter( comment => comment.post_id === post_id);
 if(result) {
   callback(null, result);
 } else {
   callback("No comments found", undefined);
 }
}

Nas funções getPoste acima getComments, se houver um erro, iremos passá-lo como o primeiro argumento. Mas se obtivermos o resultado, chamaremos a função callback e passaremos o resultado como segundo argumento para ela.

Se você estiver familiarizado com o Node.js, saberá que esse é um padrão muito comum usado em todas as funções de retorno de chamada do Node.js.

Agora vamos usar essas funções:

getPost(2, (error, post) => {
    if(error) {
     return console.log(error);
    }
    console.log('Post:', post);
    getComments(post.post_id, (error, comments) => {
        if(error) {
          return console.log(error);
        }
        console.log('Comments:', comments);
    });
});

Depois de executar o código acima, você verá a seguinte saída:

Resultado da chamada das funções getPost e getComments

Aqui está uma demonstração do CodePen .

Como você pode ver, temos a getCommentsfunção aninhada dentro do getPostcallback.

Agora imagine se também quiséssemos encontrar os gostos desses comentários. Isso também seria aninhado dentro getCommentsdo retorno de chamada, criando mais aninhamento. Isso eventualmente tornará o código difícil de entender.

Esse aninhamento dos callbacks é conhecido como callback hell.

Você pode ver que a condição de tratamento de erro também é repetida no código, o que cria código duplicado – isso não é bom.

Portanto, para corrigir esse problema e permitir operações assíncronas, as promessas foram introduzidas.

O que são promessas em JavaScript?

As promessas são uma das partes mais importantes do JavaScript – mas podem ser confusas e difíceis de entender. Muitos novos desenvolvedores, assim como os experientes, lutam para compreendê-los completamente.

Então, o que é uma promessa? Uma promessa representa uma operação assíncrona cujo resultado virá no futuro.

Antes do ES6, não havia como esperar algo para realizar alguma operação. Por exemplo, quando queríamos fazer uma chamada de API, não havia como esperar até que os resultados voltassem.

Para isso, usávamos bibliotecas externas como JQuery ou Ajax que tinham suas próprias implementações de promessas. Mas não havia nenhuma implementação JavaScript de promessas.

Mas as promessas foram adicionadas no ES6 como uma implementação nativa. E agora, usando promessas no ES6, podemos fazer uma chamada de API nós mesmos e esperar até que seja feito para executar alguma operação.

Como criar uma promessa

Para criar uma promessa, precisamos usar a Promisefunção construtora assim:

const promise = new Promise(function(resolve, reject) {
 
});

O Promiseconstrutor recebe uma função como argumento e essa função recebe internamente resolvee rejectcomo parâmetros.

Os parâmetros resolvee rejectsão, na verdade, funções que podemos chamar dependendo do resultado da operação assíncrona.

A Promisepode passar por três estados:

• Pendente
• Realizada
• rejeitado

Quando criamos uma promessa, ela está em um estado pendente. Quando chamamos a resolvefunção, ela vai para o estado cumprido e, se a chamarmos, rejectvai para o estado rejeitado.

Para simular a operação de longa duração ou assíncrona, usaremos a setTimeoutfunção.

const promise = new Promise(function(resolve, reject) {
 setTimeout(function() {
  const sum = 4 + 5;
  resolve(sum);
 }, 2000);
});

Aqui, criamos uma promessa que resolverá a soma de 4e 5após o término de um tempo limite de 2000ms (2 segundos).

Para obter o resultado da execução bem-sucedida da promessa, precisamos registrar um manipulador de callback usando .thenassim:

const promise = new Promise(function(resolve, reject) {
 setTimeout(function() {
  const sum = 4 + 5;
  resolve(sum);
 }, 2000);
});

promise.then(function(result) {
 console.log(result); // 9
});

Portanto, sempre que chamarmos resolve, a promessa retornará o valor passado para a resolvefunção que podemos coletar usando o .thenmanipulador.

Se a operação não for bem-sucedida, chamamos a rejectfunção assim:

const promise = new Promise(function(resolve, reject) {
 setTimeout(function() {
  const sum = 4 + 5 + 'a';
  if(isNaN(sum)) {
    reject('Error while calculating sum.');
  } else {
    resolve(sum);
  }
 }, 2000);
});

promise.then(function(result) {
 console.log(result);
});

Aqui, se sumnão for um número, chamamos a rejectfunção com a mensagem de erro. Caso contrário, chamamos a resolvefunção.

Se você executar o código acima, verá a seguinte saída:

Resultado da rejeição da promessa sem o manipulador catch

Como você pode ver, estamos recebendo uma mensagem de erro não capturada junto com a mensagem que especificamos porque chamar a rejectfunção gera um erro. Mas não adicionamos um manipulador de erro para detectar esse erro.

Para capturar o erro, precisamos registrar outro callback usando .catchassim:

promise.then(function(result) {
 console.log(result);
}).catch(function(error) {
 console.log(error);
});

Você verá a seguinte saída:

Resultado da rejeição da promessa com o manipulador catch

Como você pode ver, adicionamos o .catchmanipulador, então não estamos recebendo nenhum erro não detectado – estamos apenas registrando o erro no console.

Isso também evita parar seu aplicativo abruptamente.

Portanto, é sempre recomendável adicionar o .catchmanipulador a cada promessa para que seu aplicativo não pare de ser executado devido ao erro.

Quando usar resolveereject

Vamos dar um exemplo de uma chamada de API.

Se você estiver fazendo uma chamada de API e a chamada de API for bem-sucedida, chame a resolvefunção passando o resultado da API como um argumento para ela.

E se a API não for bem-sucedida, você chamará a rejectfunção passando qualquer mensagem como um argumento para ela.

Então, para indicar que a operação foi bem-sucedida, chamamos a resolvefunção e para indicar uma operação malsucedida, chamamos a rejectfunção.

O que é Promise Chaining e por que é útil?

O encadeamento de promessas é uma técnica usada para gerenciar operações assíncronas de maneira mais organizada e legível.

No encadeamento de promessas, podemos anexar vários .thenmanipuladores nos quais o resultado do .thenmanipulador anterior é passado automaticamente para o próximo .thenmanipulador.

Usar o encadeamento de promessas ajuda a evitar o problema de callback hell que vimos anteriormente.

O encadeamento de promessas também nos permite escrever código assíncrono de maneira mais linear e sequencial, o que é mais fácil de ler e entender.

Além disso, ao usar o encadeamento de promessas, podemos anexar apenas um .catchmanipulador no final de todos os .thenmanipuladores. Se qualquer uma das promessas intermediárias falhar, o último .catchmanipulador será executado automaticamente.

Portanto, não precisamos adicionar vários .catchmanipuladores. Isso elimina a verificação de vários erros, como fizemos no exemplo callback hell anteriormente.

Como funciona o encadeamento de promessas

Podemos adicionar vários .thenmanipuladores a uma única promessa como esta:

promise.then(function(result) {
 console.log('first .then handler');
 return result;
}).then(function(result) {
 console.log('second .then handler');
 console.log(result);
}).catch(function(error) {
 console.log(error);
});

Quando adicionamos vários .thenmanipuladores, o valor de retorno do .thenmanipulador anterior é passado automaticamente para o próximo .thenmanipulador.

Resultado do encadeamento de promessas

Como você pode ver, adicionar 4 + 5resolve uma promessa e obtemos essa soma no primeiro .thenmanipulador. Lá estamos imprimindo uma declaração de log e retornamos essa soma para o próximo .thenmanipulador.

E dentro do próximo .thenmanipulador, estamos adicionando uma declaração de log e, em seguida, imprimimos o resultado que obtivemos do .thenmanipulador anterior.

Essa maneira de adicionar vários .thenmanipuladores é conhecida como encadeamento de promessas.

Como atrasar a execução de uma promessa em JavaScript

Muitas vezes não queremos que a promessa seja executada imediatamente. Em vez disso, queremos atrasar até que alguma operação seja concluída.

Para conseguir isso, podemos agrupar a promessa em uma função e retornar essa promessa dessa função assim:

function createPromise() {
 return new Promise(function(resolve, reject) {
  setTimeout(function() {
   const sum = 4 + 5;
   if(isNaN(sum)) {
     reject('Error while calculating sum.');
   } else {
    resolve(sum);
   }
  }, 2000);
 });
}

Dessa forma, podemos utilizar os parâmetros da função dentro da promessa, tornando a função verdadeiramente dinâmica.

function createPromise(a, b) {
 return new Promise(function(resolve, reject) {
  setTimeout(function() {
   const sum = a + b;
   if(isNaN(sum)) {
     reject('Error while calculating sum.');
   } else {
    resolve(sum);
   }
  }, 2000);
 });
}

createPromise(1,8)
 .then(function(output) {
  console.log(output); // 9
});

// OR

createPromise(10,24)
 .then(function(output) {
  console.log(output); // 34
});

Resultado do atraso na execução da promessa

Observação: quando criamos uma promessa, ela será resolvida ou rejeitada, mas não ambas ao mesmo tempo. Portanto, não podemos adicionar duas resolveou rejectchamadas de função na mesma promessa.

Além disso, podemos passar apenas um único valor para a função resolveou reject.

Se você quiser passar vários valores para uma resolvefunção, passe-o como um objeto como este:

const promise = new Promise(function(resolve, reject) {
 setTimeout(function() {
  const sum = 4 + 5;
  resolve({
   a: 4,
   b: 5,
   sum
  });
 }, 2000);
});

promise.then(function(result) {
 console.log(result);
}).catch(function(error) {
 console.log(error);
});

Passando o objeto para resolver a função para retornar vários valores

Como usar funções de seta em JavaScript

Em todos os exemplos de código acima, usamos a sintaxe normal da função ES5 ao criar promessas.

Mas é uma prática comum usar a sintaxe de função de seta em vez da sintaxe de função ES5.

Então, vamos primeiro entender o que é uma função de seta e como usá-la.

O que são funções de seta?

Antes do ES6, havia duas formas principais de declarar funções.

1. Sintaxe de Declaração de Função:

function add(a, b) {
 return a + b;
}

2. Sintaxe de expressão de função:

const add = function(a, b) {
 return a + b;
};

A principal diferença visível entre a função regular e a função de seta é a sintaxe de escrita da função.

Usando a sintaxe da função de seta, podemos escrever a função de adição acima assim:

const add = (a, b) => {
 return a + b;
};

Você pode não ver muita diferença aqui, além da seta. Mas se tivermos uma única linha de código no corpo da função, podemos simplificar a função de seta acima assim:

const add = (a, b) => a + b;

Aqui estamos retornando implicitamente o resultado de a + b, então não há necessidade de uma returnpalavra-chave se houver uma única instrução.

Portanto, usar as funções de seta tornará seu código muito mais curto.

Usando uma função de seta, podemos escrever o código anterior conforme mostrado abaixo:

const promise = new Promise((resolve, reject) => {
 setTimeout(() => {
  const sum = 4 + 5 + 'a';
  if(isNaN(sum)) {
    reject('Error while calculating sum.');
  } else {
    resolve(sum);
  }
 }, 2000);
});

promise.then((result) => {
 console.log(result);
});

Você pode usar a sintaxe de função ES5 ou ES6, dependendo de suas preferências e necessidades.

Como usar Async/Await em JavaScript

Nesta seção, exploraremos tudo o que você precisa saber sobre async/await.

Async/await oferece aos desenvolvedores uma maneira melhor de usar as promessas.

Para usar async/await, você precisa criar uma função e adicionar a asyncpalavra-chave antes do nome da função usando a sintaxe de declaração de função ES5 como esta:

async function someFunction() {
  // function body
}

ou usando sintaxe de expressão de função como esta:

const someFunction = async function () {
  // function body
};

ou usando uma função de seta como esta:

const someFunction = async () => {
  // function body
};

Lembre-se sempre que, quando você adiciona a palavra-chave async à função, ela sempre retorna uma promessa.

Dê uma olhada no código abaixo:

const sayHello = async function () {
  return 'Hello';
};

sayHello();

Qual você acha que será a saída do código acima?

Resultado da função de chamada marcada como assíncrona

A saída é uma promessa cumprida com a string Hello.

Então o código abaixo:

const sayHello = async function () {
  return 'Hello';
};

é igual a isso:

const sayHello = function() {
 return new Promise((resolve, reject) => {
  resolve('Hello');
 });
}

que é igual a isso:

const sayHello = function () {
  return Promise.resolve('Hello');
};

Promise.resolve('Hello')é apenas uma maneira mais curta de criar uma promessa que resolve a string Hello.

Portanto, para obter a string real Hello, precisamos adicionar o .thenmanipulador assim:

sayHello().then(function (result) {
  console.log(result); // Hello
});

Obtendo o resultado da função assíncrona usando o manipulador .then

Agora, onde usamos a awaitpalavra-chave?

É usado dentro da função que é declarada como async. Portanto, a awaitpalavra-chave só deve ser usada dentro da asyncfunção.

Você receberá um erro se tentar usá-lo em funções não assíncronas.

Suponha que temos uma promessa que retorna o produto de dois números como este:

function getProduct(a, b) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      resolve(a * b);
    }, 1000);
  });
}

e estamos usando assim:

getProduct(2, 4)
  .then(function (result) {
    getProduct(result, 2)
      .then(function (finalResult) {
        console.log('final_result', finalResult);
      })
      .catch(function (error) {
        console.log(error);
      });
  })
  .catch(function (error) {
    console.log(error);
  });

No código acima, primeiro obtemos o produto de 2e 4. Em seguida, estamos usando esse resultado para multiplicá-lo 2novamente e, finalmente, imprimir o produto.

Se você executar o código acima, verá o resultado final como 16, que é 2 * 4 = 8 e 8 * 2 = 16.

Resultado do aninhamento de manipuladores de retorno de chamada

O código acima de   .thene .catchparece bastante complicado e difícil de entender à primeira vista.

Então, usando async/await, podemos simplificar o código acima para isso:

const printResult = async () => {
  try {
    const result = await getProduct(2, 4); // line 1
    const finalResult = await getProduct(result, 2); // line 2
    console.log('final_result', finalResult); // line 3
  } catch (error) {
    console.log(error);
  }
};

printResult();

Isso parece muito mais limpo e fácil de entender.

Aqui, para usar a awaitpalavra-chave, estamos declarando uma função com a asyncpalavra-chave. Então, para obter o resultado de cada promessa, adicionamos a awaitpalavra-chave antes dela.

Além disso, observe que adicionamos try/catch dentro da função. Você sempre precisa adicionar um bloco try ao redor do código que usa awaitpara que o bloco catch seja executado se a promessa for rejeitada.

Há uma coisa muito importante que você precisa lembrar: o código async/await acima funcionará exatamente da mesma forma que quando usamos .then- então a próxima awaitlinha (linha 2) não será executada até que a awaitchamada anterior (linha 1) seja bem-sucedida.

Portanto, como a getProductfunção está demorando 1 segundo para ser executada por causa da chamada setTimeout, a linha 2 terá que esperar 1 segundo antes de executar a getProductfunção novamente.

Mas há uma exceção a esse comportamento, que você pode conferir neste artigo .

Além disso, se houver um erro durante a execução da linha 1 (devido a algum erro ocorrido na getProductfunção), o próximo código após a linha 1 não será executado. Em vez disso, o bloco catch será executado.

Agora, se você comparar o código de encadeamento de promessas e async/await, verá a diferença.

// code using async/await

const printResult = async () => {
  try {
    const product = await getProduct(2, 4); // line 1
    const finalResult = await getProduct(product, 2); // line 2
    console.log('final_result', finalResult); // line 3
  } catch (error) {
    console.log(error);
  }
};

printResult();

// code using .then and .catch

getProduct(2, 4)
  .then(function (result) {
    getProduct(result, 2)
      .then(function (finalResult) {
        console.log('final_result', finalResult);
      })
      .catch(function (error) {
        console.log(error);
      });
  })
  .catch(function (error) {
    console.log(error);
  });

Como você pode ver, o código usando async/await é muito mais limpo e fácil de entender em comparação com o encadeamento de promessas.

À medida que o aninhamento se aprofunda, o código que usa o encadeamento de promessas fica mais complicado. Portanto, async/await fornece apenas uma maneira de escrever o mesmo código, mas com mais clareza.

Usar async/await também reduz a necessidade de adicionar vários .catchmanipuladores para lidar com os erros.

Podemos evitar o aninhamento no encadeamento de promessas acima escrevendo o código anterior assim:

getProduct(2, 4)
  .then(function (result) {
    return getProduct(result, 2);
  })
  .then(function (finalResult) {
    console.log('final_result', finalResult);
  })
  .catch(function (error) {
    console.log(error);
  });

Aqui, do primeiro .thenmanipulador, estamos retornando o resultado de getProduct(result, 2).

O que quer que seja retornado do .thenmanipulador anterior será passado para o próximo .thenmanipulador.

Como a getProductfunção retorna uma promessa, podemos anexar .thennovamente a ela e evitar a necessidade de um .catchmanipulador aninhado.

usando encadeamento de promessas

Mas ainda assim a sintaxe async/await parece mais limpa e fácil de entender do que a sintaxe de encadeamento de promessas.

Métodos de Promessa

Nesta seção, exploraremos os vários métodos fornecidos pela API do Promise.

Todos esses métodos são úteis quando você deseja executar várias tarefas assíncronas ao mesmo tempo, quando essas tarefas não dependem umas das outras (o que economiza muito tempo).

Porque se você executar cada tarefa uma após a outra, terá que esperar que a tarefa anterior termine antes de começar a próxima tarefa.

E se as tarefas não estiverem relacionadas entre si, não adianta esperar que a tarefa anterior termine antes de executar a próxima.

o Promise.allmétodo

Este método é usado para executar várias tarefas assíncronas simultaneamente sem ter que esperar a conclusão de outra tarefa.

Suponha que temos três promessas e todas foram resolvidas com sucesso:

const promise1 = new Promise((resolve, reject) => resolve('promise1 success'));
const promise2 = new Promise((resolve, reject) => resolve('promise2 success'));
const promise3 = new Promise((resolve, reject) => resolve('promise3 success'));

Agora, vamos usar o Promise.allmétodo.

Promise.allprecisa de uma série de promessas como seu argumento.

Promise.all([promise1, promise2, promise3])
  .then((result) => {
    console.log('resolved', result); // resolved ["promise1 success", "promise2 success", "promise3 success"]
  })
  .catch((error) => {
    console.log('rejected', error);
  });

Conforme todas as promessas forem resolvidas, resultaparecerá um array contendo os resultados das promessas resolvidas.

Agora, e se alguma das promessas for rejeitada?

const promise1 = new Promise((resolve, reject) => resolve('promise1 success'));
const promise2 = new Promise((resolve, reject) => reject('promise2 failure'));
const promise3 = new Promise((resolve, reject) => resolve('promise3 success'));

Promise.all([promise1, promise2, promise3])
  .then((result) => {
    console.log('resolved', result);
  })
  .catch((error) => {
    console.log('rejected', error); // rejected promise2 failure
  });

No código acima, a promessa2 é rejeitada para que o manipulador catch seja executado e, no caso de Promise.all:

• Se uma das promessas for rejeitada, o errorirá conter a mensagem de erro da promessa que falhou (como no nosso caso acima)
• Se várias promessas forem rejeitadas, errorserá a mensagem de erro da primeira promessa com falha.

Nota: Mesmo que a promessa intermediária seja rejeitada, todas as próximas promessas não serão interrompidas. Todos eles serão executados – mas apenas o primeiro valor de promessa rejeitado estará disponível no parâmetro de erro do bloco catch.

o Promise.racemétodo

Considere novamente as três promessas resolvidas:

const promise1 = new Promise((resolve, reject) => resolve('promise1 success'));
const promise2 = new Promise((resolve, reject) => resolve('promise2 success'));
const promise3 = new Promise((resolve, reject) => resolve('promise3 success'));

Promise.race([promise1, promise2, promise3])
  .then((result) => {
    console.log('resolved', result); // resolved promise1 success
  })
  .catch((error) => {
    console.log('rejected', error);
  });

Como você pode ver aqui, assim que a primeira promessa for resolvida, o Promise.racemétodo retornará o resultado dessa promessa resolvida.

Agora, dê uma olhada no código abaixo:

const promise1 = new Promise((resolve, reject) => reject('promise1 failure'));
const promise2 = new Promise((resolve, reject) => resolve('promise2 success'));
const promise3 = new Promise((resolve, reject) => resolve('promise3 success'));

Promise.race([promise1, promise2, promise3])
  .then((result) => {
    console.log('resolved', result);
  })
  .catch((error) => {
    console.log('rejected', error); // rejected promise1 failure
  });

Como você pode ver aqui, a primeira promessa em si é rejeitada para que o .catchmanipulador seja executado.

Então, quando usamos o Promise.racemétodo, ele espera até que a primeira promessa seja resolvida ou rejeitada e então:

• Se a primeira promessa na cadeia de promessas for resolvida, o .thenmanipulador será executado e o resultado será o resultado da primeira promessa resolvida.
• Se a primeira promessa na cadeia de promessas for rejeitada, o .catchmanipulador será executado e o resultado será o resultado da primeira promessa que falhou.
• Se várias promessas forem rejeitadas, o .catchmanipulador será executado e o resultado será o resultado da primeira promessa com falha.

o Promise.allSettledmétodo

Este método é útil quando você deseja saber o resultado de cada tarefa, mesmo que sejam rejeitadas.

Porque em Promise.alle Promise.race, obtemos apenas o resultado da primeira promessa rejeitada e não há como obter o resultado de outras promessas bem-sucedidas ou malsucedidas.

Portanto, usando Promise.allSettledpodemos obter o resultado de todas as promessas, mesmo que tenham falhado.

Dê uma olhada no código abaixo:

const promise1 = new Promise((resolve, reject) => resolve('promise1 success'));
const promise2 = new Promise((resolve, reject) => resolve('promise2 success'));
const promise3 = new Promise((resolve, reject) => resolve('promise3 success'));

Promise.allSettled([promise1, promise2, promise3]).then((result) => {
  console.log('resolved', result);
});

/* output from `.then`:
resolved [
  {
    "status": "fulfilled",
    "value": "promise1 success"
  },
  {
    "status": "fulfilled",
    "value": "promise2 success"
  },
  {
    "status": "fulfilled",
    "value": "promise3 success"
  }
]
*/

Como você pode ver, o Promise.allSettledmétodo espera até que todas as promessas sejam resolvidas ou rejeitadas e o resultwill conterá o resultado de cada promessa.

const promise1 = new Promise((resolve, reject) => reject('promise1 failure'));
const promise2 = new Promise((resolve, reject) => resolve('promise2 success'));
const promise3 = new Promise((resolve, reject) => resolve('promise3 success'));

Promise.allSettled([promise1, promise2, promise3]).then((result) => {
  console.log('resolved', result);
});

/* output from `.then`:
resolved [
  {
    "status": "rejected",
    "reason": "promise1 failure"
  },
  {
    "status": "fulfilled",
    "value": "promise2 success"
  },
  {
    "status": "fulfilled",
    "value": "promise3 success"
  }
]
*/

No caso acima, mesmo que a primeira promessa seja rejeitada, obtemos o resultado de todas as promessas dentro do .thenmanipulador.

const promise1 = new Promise((resolve, reject) => reject('promise1 failure'));
const promise2 = new Promise((resolve, reject) => reject('promise2 failure'));
const promise3 = new Promise((resolve, reject) => reject('promise3 failure'));

Promise.allSettled([promise1, promise2, promise3]).then((result) => {
  console.log('resolved', result);
});

/* output from `.then`:
 resolved [
  {
    "status": "rejected",
    "reason": "promise1 failure"
  },
  {
    "status": "rejected",
    "reason": "promise2 failure"
  },
  {
    "status": "rejected",
    "reason": "promise3 failure"
  }
] 
*/

Aqui, mesmo que todas as promessas sejam rejeitadas, o .thenmanipulador ainda será executado e obteremos o resultado de cada promessa.

Obrigado por ler!

É isso para este tutorial. Espero que você tenha aprendido muito com isso.

Fonte: https://www.freecodecamp.org

#javascript