Por que e quando devo utilizar o Observable, quais suas vantagem e desvantagens e sua diferença se comparado com Promisses?
2 Respostas
Tanto uma Promise quanto um Observable trazem abstrações para ajudar a lidar com eventos assíncronos.
Uma Promise lida com um único evento que pode ter sucesso ou falhar, enquanto um Observable lida com 0, 1 ou múltiplos eventos, disparando o callback especificado a cada um desses eventos.
A maior vantagem de um Observable é ter uma maior flexibilidade em relação a uma Promise, por exemplo, é possível cancelar uma requisição, retentar realizar uma ação, enquanto a Promise só possui dois estados que são de sucesso ou falha.
Um ótimo artigo relacionado a este tema é: https://tableless.com.br/entendendo-rxjs-observable-com-angular/
Trouxe esse artigo que foi publicado pelo Wendel Nascimento que encontrei para que você possa ver não só o que é mais também como usar, talvez você entenda melhor.
Link de onde peguei a referencia para você verificar o Artigo Completo.: https://tableless.com.br/entendendo-rxjs-observable-com-angular/
O que é um Observable?
Por definição é uma coleção que funciona de forma unidirecional, ou seja, ele emite notificações sempre que ocorre uma mudança em um de seus itens e a partir disso podemos executar uma ação. Digamos que ele resolve o mesmo problema que a versão anterior do Angular havia resolvido com o $watch, porém sem usar força bruta. Enquanto no $watch verificamos todo nosso escopo por alterações após cada $digest cycle (o que tem um grande custo na performance), com Observable esta verificação não acontece, pois para cada evento é emitida uma notificação para nosso Observable e então tratamos os dados.
O que faço com Observable? E onde entra Angular nessa história?
Vamos imaginar o consumo de uma web service, algo bem comum em aplicação Single Page, antes do Observable faríamos dessa maneira
getUsers(): Promise<User[]>{
return fetch(myApiUrl)
.then(res=>res.json())
.catch(err=> Observable.throw(err.message));
} O código acima é bem simples, estamos buscando um recurso (Uma lista de usuários) e após a resposta transformamos tudo em JSON.
Entretanto, o novo Angular foi construído pensando em aplicações reativas, abandonando o uso de Promises e adotando por padrão o Observable.
Usando Observable a mesma função ficaria da seguinte maneira:
@Injectable()
class UserService {
...
getUsers(): Observable<User[]> {
return this.http.get(myApiUrl)
.map(res=>res.json())
.catch(err=> Observable.throw(err.message));
}
...
}
-
2Esse artigo já foi referenciado pela outra resposta, não vejo vantagens em copiar ipsis litteris parte dele como uma nova resposta.– Woss10/01/2019 às 10:30
-
2Você verificou se é possível copiar o conteúdo de lá? Não tem uma notificação explícita, mas por padrão se não tem uma dizendo que pode copiar devemos entender que não pode.– Maniero ♦26/08/2019 às 12:16