Skip to main content
4 de 6
Melhorando texto
BrunoRB
  • 5,7mil
  • 1
  • 17
  • 31

Promises (ou Promessas) são uma abstração utilizada para representar fluxos de ações em código assíncrono. Em JavaScript promises são objetos, sendo que um objeto Promise representa o resultado de uma operação assíncrona, podendo este resultado ser bem sucedido (gerado pela chamada da função resolve e que desencadeia a chamada do método then) ou mal sucedido (gerado pela chamada da função reject e que desencadeia a chamada do método catch). Um exemplo simples para ilustrar o conceito:

var message = 'Vazia';

// Aqui criamos uma Promesa que será "resolvida" após o disparo do timer
// (1 segundo)
var promise = new Promise(function(resolve, reject) {
  setTimeout(function() {
    message = 'Preenchida';
    resolve();
  }, 1000);
});

// a função anônima passada como parâmetro para ".then" representa a ação que
// será realizada quando nossa promessa for resolvida/cumprida
promise.then(function() {
  $('body').append('valor message em .then: ' + message + '<br>');
});


$('body').append('valor message: ' + message + '<br>');
<script src="https://cdn.jsdelivr.net/es6-promise/3.1.2/es6-promise.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Executando o exemplo você verá como o primeiro valor impresso de message é "Vazia" e o segundo o que contêm "em .then: Preenchida". Isso ocorre pois o último append feito é síncrono, ele é executado exatamente no momento em que o interpretador de JavaScript chega naquele ponto, já a impressão dentro do .then depende da resolução da Promise, e esta só ocorre na chamada de resolve() após o disparo do timer (1 segundo).

A utilidade de Promises é sua capacidade de representação de fluxo assíncrono de uma maneira compreensível para o desenvolvedor. Como exemplo veja como é o modo "tradicional/antigo" para representar tal fluxo em javascript:

algumaFnAsync(function() {
    outraAsyncFn(function() {
        maisUmaAsyncFn(function() {
           // código que faz algo após todas
           // as operações assíncronas terem completado
        });
    });
});

Você tem funções assíncronas que recebem uma função anônima como parâmetro, sendo que esta função será executada quando a tal função assíncrona terminar sua execução. Não é difícil enxergar o problema aí, em séries de códigos assíncronos que precisam ser executados um após o outro você acaba com vários níveis de aninhamento, o chamado callback hell (não encontrei uma boa ref em PT). Promises resolvem esse problema, veja como o exemplo anterior poderia ser reescrito com o uso delas:

algumaFnAsync().then(function() {
    return outraAsyncFn();
}).then(function() {
    return maisUmaAsyncFn();
}).then(function() {
    // código que faz algo após todas  as operações assíncronas terem completado
});

O código é mais claro na sua intenção e a representação é bem mais próxima de um fluxo síncrono onde você tem "faça isso, depois isso, depois aquilo". Embora sejam uma abstração não trivial promises são uma boa solução para o problema que é a representação de fluxo assíncrono em código.

BrunoRB
  • 5,7mil
  • 1
  • 17
  • 31