1

Estou aprendendo Node e apanhando um pouco da programação assíncrona. Pra aprender, eu peguei o seguinte exemplo

console.log("1");
setTimeout(function(){console.log("2");},3000);
console.log("3");
setTimeout(function(){console.log("4");},1000);

A saída que eu queria, é que fosse 1, 2, 3, e 4. Mas sai 1, 3, 4, 2 por conta da programação assíncrona. Pesquisei na internet e achei alguns lugares citando promises, mas os exemplos que eu achei de promise são um pouco complexo e não entendi bem. Creio que não deve ser difícil resolver esse problema, porém não achei algo muito bem explicado. Se alguém puder me mostrar um código pra resolver isso eu agradeceria, obrigado

2 Respostas 2

1

O problema começa no facto de o 2 e o 4 serem escritos assincronamente, logo se deixar tudo rolar normalmente serão escritos no fim.

Começo por dizer que esse exemplo ainda é fazível sem Promises, mas não é uma solução escalável:

console.log("1");
setTimeout(() => {
    console.log("2");
    console.log("3");
    setTimeout(() => console.log("4"),1000);
},1500);

Exemplo simples

Antes de começar com Promises tem de perceber para que servem e como se utilizam em cenários simples mesmo. Imagine que quer mostrar um numero na consola utilizando uma Promise e um setTimeout para que a escrita seja temporizada.

Nesse caso poderia fazer assim:

const timer = new Promise((resolve, reject) => {
  setTimeout(() => resolve(10), 1000);
});

timer.then(valor => console.log(valor));

Repare que a Promise recebe dois callbacks um de sucesso normalmente chamado de resolve e um de erro normalmente chamado de reject. Quando faz resolve dentro da Promise está a executar a função recebida passando o valor de sucesso. Depois chamamos o .then passando a função de sucesso que é:

valor => console.log(valor)

Que faz log do valor recebido. Optei por escrever com Arrow Function para ser mais simples e compacto, mas também pode ser escrito com função normal:

timer.then(function(valor){ 
    console.log(valor); 
});

O mesmo se aplica ao resto das funções no exemplo. Veja o mesmo exemplo totalmente sem Arrow Functions:

const timer = new Promise(function(resolve, reject){
  setTimeout(function(){
    resolve(10)
  }, 1000);
});

timer.then(function(valor){
  console.log(valor)
});

Encadeando Promisses

Um dos objetivos principais das Promises é conseguir encadear as várias chamadas com then evitando o aninhamento. O aninhamento seria maior consoante a quantidade de coisas encadeadas que pretende fazer. Se algum erro surgir em algum dos promises no encadeamento ele será apanhado pelo catch.

Veja o primeiro exemplo rescrito com Promises:

const timer2 = new Promise((resolve, reject) => {
  setTimeout(() => resolve("2"),1500);
});

console.log("1");
timer2.then(valor => {
  console.log(valor);
  console.log("3");
  return new Promise((resolve, reject) => {
    setTimeout(() => resolve("4"),1000);
  });
}).
then(valor => console.log(valor));

Async e Await

Apenas como nota final, deixo aqui a dica que async e await são bem mais fáceis de trabalhar, ficando num estilo mais perto do convencional quando não se trabalha com funções assincronas. É importante de perceber primeiro como funcionam as Promises pois esta alternativa é baseada nelas.

Não irei entrar em detalhes pois o @epx já deu uma ideia de seguir por este caminho.

2
  • Nossa, muito obrigado pela sua resposta, Isac, foi muito esclarecedora, simples e objetivo. Muito obriagdo de verdade! 29/03/2018 às 21:21
  • @MatheusRocha Sem problema, estamos ca para ajudar
    – Isac
    29/03/2018 às 22:05
1

Tenho uns exemplos prontos que encadeiam dois timers, espero que seja útil. O primeiro usa Promises, esperando um tempo, retornando um resultado aleatório e simulando falhas para que se veja o que acontece quando a promessa não é "cumprida":

"use strict";

function op1()
{
        return new Promise((fulfill, reject) => {
                setTimeout(() => {
                        let n = Math.random();
                        if (n >= 0.75) {
                                reject("op1 failed");
                        } else {
                                fulfill(n);
                        }
                }, 1000);
        });
}

function op2(x)
{
        return new Promise((fulfill, reject) => {
                setTimeout(() => {
                        let n = Math.random();
                        if (n <= 0.25) {
                                reject("op2. failed");
                        } else {
                                fulfill(Math.floor(x / 0.75 * 1000));
                        }
                }, 1000);
        });
}

console.log("Start");

op1()
.then(op2)
.then((res) => {
        console.log("Sucess: " + res);
})
.catch((err) => {
        console.log("Error: " + err);
});

O final do código pode ser substituído pela sintaxe async/await. Infelizmente, para esperar (await) pelo resultado de uma função assíncrona, também é preciso que await esteja dentro de uma função async, por isso a função anônima:

(async () => {
        try {
                let x = await op1();
                let res = await op2(x);
                console.log("Sucess: " + res)
        } catch (err) {
                console.log("Error: " + err)
        }
})();
3
  • Amigo, desculpe encher o saco, mas nesse caso ele executa a op1, que pega um valor random, se for maior ou igual que 0.75 ele dá erro, se não ele da um fullfill(n). O que seria esse fullfill? Obrigado! 29/03/2018 às 3:28
  • "Fulfill" quer dizer "cumprir", no sentido de "cumprir a promessa". Na verdade é um callback passado como parâmetro passado pela Promise e a variável poderia ter qualquer outro nome, tipo "ok", "bom", "cumprir", o que você desejar.
    – epx
    29/03/2018 às 3:52
  • 1
    @MatheusRocha O fulfill utilizado no exemplo é o que mais normalmente é chamado de resolve no comum dos códigos com Promisses
    – Isac
    29/03/2018 às 9:54

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .