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.