Introdução
Funções de callback
Funções de callback são funções passadas como argumentos.
Esse padrão de programação cria uma sequência de chamadas de função tanto na programação síncrona quanto na assíncrona.
Escrever uma função de callback não é diferente de escrever uma função; no entanto, a função de callback precisa corresponder à assinatura definida pela função chamadora.
const squareLength = 5;
// Caller function takes a callback function
function applyToSquare(callback) {
return callback(squareLength);
}
// Callback must expect the possible argument from the calling function
function areaOfSquare(number) {
return number * number;
}
applyToSquare(areaOfSquare); // => 25
Você também pode escrever callbacks como uma expressão de função, uma expressão de função anônima ou uma expressão de arrow function:
applyToSquare(function squarePerimeter(side) {
return side * 4;
});
applyToSquare(function (side) {
return side * 4;
});
applyToSquare((side) => {
return side * 4;
});
Instruções
Você está criando um novo portal online para que seus clientes comprem frutas frescas direto do merceeiro. O merceeiro tem uma API que você pode usar para ver se ele tem o estoque desejado pelos seus clientes. Você precisa criar uma pequena biblioteca de funções para interagir com a API do merceeiro.
1. Avise seu cliente quando o pedido dele for bem-sucedido
O portal deve avisar seu cliente se o pedido dele foi bem-sucedido. Defina a função de callback onSuccess que será chamada se o pedido foi bem-sucedido porque o merceeiro tinha fruta suficiente em estoque. Essa função deve invocar a função notify importada, passando { message: 'SUCCESS' } para avisar seu cliente de que o pedido dele foi bem-sucedido.
onSuccess();
// => `notify` called with `{ message: 'SUCCESS' }`
2. Avise seu cliente quando o pedido dele não for bem-sucedido
O portal deve avisar seu cliente se o pedido dele não foi bem-sucedido. Defina a função de callback onError que será chamada se o pedido não foi bem-sucedido porque o merceeiro não tem a fruta em estoque ou porque houve um erro. Essa função deve invocar a função notify importada, passando { message: 'ERROR' } para avisar seu cliente de que o pedido dele não foi bem-sucedido.
onError();
// => `notify` called with `{ message: 'ERROR' }`
3. Crie um wrapper de API para envolver a função de pedido da API do merceeiro
Os pedidos de fruta são feitos pela API do merceeiro por meio da função order fornecida. Essa função recebe três argumentos: uma query, contendo a variety e a quantity da fruta pedida, uma função callback a ser invocada quando o pedido for bem-sucedido, e uma função callback a ser invocada quando o pedido encontrar um erro.
Você quer proteger sua base de código de possíveis mudanças externas e decide envolver a chamada à função order dentro de uma nova função chamada orderFromGrocer. Implemente a função orderFromGrocer que tenta fazer um pedido por meio de uma chamada à função order da API do merceeiro, garantindo que os argumentos passados para orderFromGrocer sejam repassados à chamada da API.
A query tem o formato de um objeto:
const query = {
variety: string,
quantity: number,
};
orderFromGrocer(
{ variety: 'pear', quantity: 12 },
exampleSuccessCallback,
exampleErrorCallback,
);
// => `order` was called with the query and the callbacks
4. Simplifique o tratamento de pedidos realizados
Seus clientes agora conseguem fazer pedidos de fruta pelo seu portal, mas você percebe que está invocando a função orderFromGrocer em muitos lugares diferentes da sua base de código, e sempre precisa passar uma query e as duas funções callback como argumentos. Vendo uma oportunidade de refatorar seu código, você acha que seria mais simples poder fazer um pedido passando apenas a variety e a quantity da fruta necessária. Defina a função auxiliar postOrder que recebe variety e quantity como argumentos e tenta fazer um pedido com o merceeiro.
postOrder('peach', 100);
// => order placed for 100 peaches
Exercício de aprendizagem
