Promise

Uma Promise (promessa) em JavaScript é um objeto que representa o resultado de uma operação assíncrona. Ela pode estar em um dos três estados: pendente (pending), realizada (resolved), ou rejeitada (rejected). As Promises são usadas para lidar com tarefas assíncronas de forma mais organizada e eficiente, evitando o uso excessivo de callbacks aninhados.

Quando uma Promise é criada, ela executa uma função que pode ser assíncrona. Essa função recebe dois parâmetros, resolve e reject, que são funções fornecidas pelo JavaScript para indicar se a operação assíncrona foi bem-sucedida (resolve) ou falhou (reject). Dentro da função assíncrona, quando a tarefa é concluída com sucesso, chamamos resolve(valor) para retornar o resultado desejado. Se ocorrer um erro ou a tarefa falhar, chamamos reject(erro) para indicar o motivo da falha.

Por exemplo:

let minhaPromise = new Promise((resolve, reject) => {
  // Simulando uma operação assíncrona
  setTimeout(() => {
    let sucesso = true; // Mudar para false para simular um erro
    if (sucesso) {
      resolve("Operação concluída com sucesso!");
    } else {
      reject("Erro: operação falhou!");
    }
  }, 4000); // Tempo de espera de 4 segundos
});

minhaPromise.then((resultado) => {
  console.log(resultado); // Resultado quando a Promise é resolvida
}).catch((erro) => {
  console.error(erro); // Mensagem de erro quando a Promise é rejeitada
});

Neste exemplo, minhaPromise é uma Promise que simula uma operação assíncrona. Se a operação for bem-sucedida, a Promise é resolvida e o resultado é capturado pelo método .then(). Se houver um erro, a Promise é rejeitada e o motivo é capturado pelo método .catch().

Encadeamento de Promises

As Promises podem ser encadeadas para executar uma sequência de operações assíncronas. Isso é feito usando o método .then() para lidar com a resolução de uma Promise e retornar outra Promise. Por exemplo:

minhaPromise
	.then((resultado) => {
		console.log(resultado);
		return outraPromise;
	})
	.then((resultado) => {
		console.log(resultado);
	})
	.catch((erro) => {
		console.error(erro);
	});

Neste exemplo, minhaPromise é resolvida e o resultado é capturado pelo método .then(). Em seguida, outraPromise é retornada e resolvida, e o resultado é capturado pelo próximo .then(). Se houver um erro em qualquer uma das Promises, ele será capturado pelo método .catch().

Async/Await

O ES8 (ECMAScript 2017) introduziu as palavras-chave async e await para simplificar o uso de Promises. A palavra-chave async é usada para declarar uma função assíncrona, que retorna uma Promise. A palavra-chave await é usada dentro de funções assíncronas para esperar a resolução de uma Promise.

Por exemplo:

async function minhaFuncao() {
	let resultado = await minhaPromise;
	console.log(resultado);
}

Neste exemplo, a função minhaFuncao() é declarada como assíncrona e aguarda a resolução da Promise minhaPromise usando a palavra-chave await. Quando a Promise é resolvida, o resultado é armazenado na variável resultado.

Exemplo AJaX com Promise

O código abaixo apresenta um exemplo completo de código escrito de AJaX escrito por meio de uma Promise. Neste diretório, você também encontrará exemplos mais simples do uso de Promise e async/await.

git clone -b dev https://github.com/rodrigoprestesmachado/cpw2
cd cpw2/exemplos/AJaX-promise
code .

Exercícios do Freecode camp

• Create a JavaScript Promise

• Complete a Promise with resolve and reject

• Handle a Fulfilled Promise with then

• Use Arrow Functions to Write Concise Anonymous Functions

Referências 📚

• Promise no MDN Web Docs

• Usando promises no MDN Web Docs

CC BY 4.0 DEED