Skip to main content
replaced http://pt.stackoverflow.com/ with https://pt.stackoverflow.com/
Fonte Link

Nesse caso eu me aproveitei do fato que funções definidas dentro de outras têm acesso às suas variáveis locaistêm acesso às suas variáveis locais. Mas eu poderia também usar o valor de retorno de uma como parâmetro pra outra:

Nesse caso eu me aproveitei do fato que funções definidas dentro de outras têm acesso às suas variáveis locais. Mas eu poderia também usar o valor de retorno de uma como parâmetro pra outra:

Nesse caso eu me aproveitei do fato que funções definidas dentro de outras têm acesso às suas variáveis locais. Mas eu poderia também usar o valor de retorno de uma como parâmetro pra outra:

Fim da Recompensa com 50 pontos de reputação concedidos por utluiz
Fonte Link
mgibsonbr
  • 82,6mil
  • 22
  • 186
  • 334

Na realidade, se seu programa estiver bem estruturado a forma de raciocínio ("primeiro acontece isso e em seguida tem que acontecer aquilo") não é assim tão diferente. Imagine uma função do tipo:

function f() {
    var x = prompt("Digite x");
    var y = x * x;
    alert(y);
    console.log("pronto");
}

Há 4 instruções sendo executadas, e cada uma delas tem que acontecer depois da anterior. Suponha que você coloque cada uma delas em uma função (nesse caso é overkill, mas em geral se uma função é muito grande faz sentido quebrá-la em funções menores, certo?):

function f() {
    var x, y;

    function a() { x = prompt("Digite x"); }
    function b() { y = X * x; }
    function c() { alert(y); }
    function d() { console.log("pronto"); }

    a();
    b();
    c();
    d();
}

Nesse caso eu me aproveitei do fato que funções definidas dentro de outras têm acesso às suas variáveis locais. Mas eu poderia também usar o valor de retorno de uma como parâmetro pra outra:

function f() {
    function a() { return prompt("Digite x"); }
    function b(x) { return X * x; }
    function c(y) { alert(y); }
    function d() { console.log("pronto"); }

    d(c(b(a())));
}

Nesse caso fica feio (pois a chamada é na ordem inversa), mas a sequência em que as operações são executadas é a mesma. Note que o código das funções continua bem organizado e lógico.

Agora, como seria se em vez de ler a entrada do usuário fizéssemos uma requisição via Ajax para obtê-la? E se no final, em vez de mostrar pro usuário fizéssemos uma segunda requisição para enviar ao servidor? Com promessas, tirando a questão do formato de dados o programa continua o mesmo!

function f() {
    function a() { return get('/le_valor/'); }
    function b(x) { return x * x; }
    function c(y) { return post('/resultado/', {valor:y}); }
    function d() { console.log("pronto"); }

    return a().then(b).then(c).then(d);
}

O fato de que o computador vai demorar um pouco entre a execução de cada uma dessas funções não importa - o fato é que elas serão executadas na mesma sequência lógica que você concebeu.

Na prática, é claro que você não vai colocar cada instrução numa função separada, ainda que em princípio isso seja possível (em Q pelo menos - já que ele mistura bem tanto funções síncronas quanto assíncronas). Em vez disso, tudo o que precisa fazer é enxergar em que pontos uma operação assíncrona vai acontecer, e garantir que sua função interna termine justamente nessa operação:

function f() {
    function a() { return get('/le_valor/'); }
    function b(x) { 
        var y = x * x;
        return post('/resultado/', {valor:y}); 
    }
    function d() { console.log("pronto"); }

    return a().then(b).then(d);
}

Notas:

  • Se uma função precisa do resultado de duas ou mais funções, basta misturar o exemplo que usa closures com o exemplo que retorna os valores. Exemplo:

      function f() {
          var x, y;
    
          function a() { return get('/le_valor/'); }
          function b(data) { 
              x = data;
              y = x * x;
              return post('/resultado/', {valor:y}); 
          }
          function d() { console.log("O quadrado de " + x + " é " + y); }
    
          return a().then(b).then(d);
      }
    

    Você poderia em vez disso usar um then aninhado, mas na minha opinião fica mais difícil de entender o código (como você já percebeu):

      function f() {
          function a() { return get('/le_valor/'); }
          function b(x) { 
              y = x * x;
              return post('/resultado/', {valor:y}).then(function() {
                  console.log("O quadrado de " + x + " é " + y);
              }); 
          }
    
          return a().then(b);
      }
    
  • Se uma outra função qualquer precisa executar depois de f, não tem problema: como ela também retorna uma promessa, pode-se usá-la normalmente (desde é claro que no mesmo estilo):

      function g() {
          function a() { /* faz algo */ }
          function b() { /* faz algo - em seguida, tem que chamar f */ }
          function c() { /* faz algo - tem que ser executada depois de f */ }
          a().then(b).then(f).then(c);
      }
    

    ou:

      function g() {
          function a() { /* faz algo */ }
          function b() { 
              /* faz algo */ 
              return f();
          }
          function c() { /* faz algo - tem que ser executada depois de f */ }
          a().then(b).then(c);
      }
    

    Esse segundo estilo é o ideal se b precisa passar parâmetros para f. b precisa ser síncrona, entretanto. Caso contrário, pode-se usar a estratégia dos closures como na nota anterior.

  • Em linguagens que suportam o conceito de continuations, esse tipo de estruturação do programa não seria necessário - poderia-se ter uma função normal, em que uma chamada assíncrona no meio dela parasse tudo o que o computador estava fazendo, salvasse a pilha de execução e todos os seus dados, e quando a chamada completasse continuasse a execução como se a interrupção nunca tivesse acontecido. Seria o equivalente a uma chamada blocante (blocking call), mas que poderia ser executada em um único thread.

    Há quem tenha interesse de programar dessa forma em JavaScript, mesmo sem o suporte da linguagem (exemplo). Mas no fim das contas, acaba ficando uma estruturação feia, não muito diferente das chamadas com callback. O uso de promessas é, na minha opinião, um meio mais elegante de se resolver o problema da assincronicidade.

  • Esse artigo (em inglês) dá mais exemplos do uso prático do Q. Queria cobrir mais dele aqui, mas a resposta já está por demais extensa... Vou parando por aqui, espero que tenha esclarecido um pouco o raciocínio por trás do uso de promessas, e mostrado que não é tão difícil quanto parece à primeira vista.