2.1 Criando Promises
Promises — é um objeto que representa a conclusão (ou falha) de uma operação assíncrona e seu resultado. Eles foram introduzidos no ES6 (ECMAScript 2015) e se tornaram a maneira padrão de trabalhar com código assíncrono no JavaScript.
Conceitos principais
Uma Promise pode estar em um dos três estados:
- Pending (pendente): estado inicial, não concluída nem rejeitada.
- Fulfilled (concluída): operação concluída com sucesso.
- Rejected (rejeitada): operação concluída com erro.
Criando uma Promise
Uma Promise é criada usando o construtor Promise, que aceita uma função executora (executor function). Esta função recebe dois argumentos: resolve e reject. Dentro desta função, o código assíncrono é executado, e no caso de sucesso, resolve é chamado, e no caso de erro — reject.
Sintaxe:
const promise = new Promise((resolve, reject) => {
// Operação assíncrona
if (/* conclusão bem-sucedida */) {
resolve(value); // Sucesso
} else {
reject(error); // Erro
}
});
Exemplo de criação de uma Promise:
const myPromise = new Promise((resolve, reject) => {
const success = true; // Condição para execução bem-sucedida
if (success) {
resolve('Operation was successful');
} else {
reject('Operation failed');
}
});
2.2 Usando Promises
Método then
O método then é usado para lidar com a conclusão bem-sucedida da Promise. Ele aceita duas funções: a primeira para lidar com a conclusão bem-sucedida e a segunda para lidar com erros. No entanto, geralmente, para lidar com erros, o método catch é usado.
Exemplo de uso do then:
myPromise.then(
(successMessage) => {
console.log(successMessage); // Vai exibir: Operation was successful
},
(errorMessage) => {
console.error(errorMessage); // Será chamado em caso de erro
}
);
Método catch
O método catch é usado para lidar com erros da Promise. Ele aceita uma função que será chamada no caso de rejeição da Promise.
Exemplo de uso do catch:
myPromise
.then((successMessage) => {
console.log(successMessage);
})
.catch((errorMessage) => {
console.error(errorMessage); // Será chamado: Operation failed
});
Método finally
O método finally é usado para executar código independentemente do resultado da Promise (sucesso ou erro). Ele não aceita argumentos e é executado em qualquer caso após a conclusão ou rejeição da Promise.
Exemplo de uso do finally:
myPromise
.then((successMessage) => {
console.log(successMessage);
})
.catch((errorMessage) => {
console.error(errorMessage);
})
.finally(() => {
console.log('Operation completed'); // Será chamado em qualquer caso
});
2.3 Exemplos de uso de Promises
Exemplo 1: Operação assíncrona usando Promise
Simulação de operação assíncrona com temporizador.
function asyncOperation() {
return new Promise((resolve, reject) => {
setTimeout(() => {
const success = Math.random() > 0.5;
if (success) {
resolve('Async operation was successful');
} else {
reject('Async operation failed');
}
}, 2000);
});
}
asyncOperation()
.then((message) => {
console.log(message);
})
.catch((error) => {
console.error(error);
})
.finally(() => {
console.log('Async operation completed');
});
Exemplo 2: Execução sequencial de Promises
Simulação de operações assíncronas sequenciais.
function firstOperation() {
return new Promise((resolve) => {
setTimeout(() => {
console.log('First operation completed');
resolve('First result');
}, 1000);
});
}
function secondOperation(result) {
return new Promise((resolve) => {
setTimeout(() => {
console.log('Second operation completed');
resolve(`Second result, received: ${result}`);
}, 1000);
});
}
firstOperation()
.then((result) => {
return secondOperation(result);
})
.then((finalResult) => {
console.log(finalResult);
})
.catch((error) => {
console.error(error);
})
.finally(() => {
console.log('Both operations completed');
});
Exemplo 3: Execução paralela de Promises com Promise.all
Simulação de operações assíncronas paralelas.
function operationOne() {
return new Promise((resolve) => {
setTimeout(() => {
console.log('Operation One completed');
resolve('Result One');
}, 1000);
});
}
function operationTwo() {
return new Promise((resolve) => {
setTimeout(() => {
console.log('Operation Two completed');
resolve('Result Two');
}, 1500);
});
}
Promise.all([operationOne(), operationTwo()])
.then((results) => {
console.log('All operations completed');
console.log(results); // Vai exibir: ['Result One', 'Result Two']
})
.catch((error) => {
console.error('One of the operations failed', error);
});
GO TO FULL VERSION