RxJS - últimas atualizações

Estamos usando o RxJS versão 6 neste tutorial. RxJS é comumente usado para lidar com programação reativa e mais frequentemente com Angular, ReactJS. Angular 6 carrega rxjs6 por padrão.

O RxJS versão 5 foi tratado de forma diferente em comparação com a versão 6. O código será interrompido caso você atualize seu RxJS 5 para 6. Neste capítulo, veremos a diferença nas maneiras de lidar com a atualização da versão.

Caso você esteja atualizando o RxJS para 6 e não queira fazer as alterações no código, você também pode fazer isso e terá que instalar o seguinte pacote.

npm install --save-dev rxjs-compact

Este pacote se encarregará de fornecer compatibilidade com versões anteriores e o código antigo funcionará bem com o RxJS versão 6. Se você deseja fazer as alterações de código que funcionam bem com o RxJS 6, aqui estão as alterações que precisam ser feitas.

Os pacotes para operadores, observáveis, assunto foram reestruturados e, portanto, as principais mudanças vão para as importações e são explicadas a seguir.

Importações para operadoras

De acordo com a versão 5, para os operadores, as seguintes declarações de importação devem ser incluídas -

import 'rxjs/add/operator/mapTo'
import 'rxjs/add/operator/take'
import 'rxjs/add/operator/tap'
import 'rxjs/add/operator/map'

Na versão 6 do RxJS as importações serão as seguintes -

import {mapTo, take, tap, map} from "rxjs/operators"

Importação de métodos para criar observáveis

De acordo com a versão 5, ao trabalhar com Observáveis, os seguintes métodos de importação devem ser incluídos -

import "rxjs/add/observable/from";
import "rxjs/add/observable/of";
import "rxjs/add/observable/fromEvent";
import "rxjs/add/observable/interval";

Na versão 6 do RxJS as importações serão as seguintes -

import {from, of, fromEvent, interval} from 'rxjs';

Importação de observáveis

No RxJS versão 5, ao trabalhar com observáveis, as seguintes instruções de importação devem ser incluídas -

import { Observable } from 'rxjs/Observable'

No RxJS versão 6, as importações serão as seguintes -

import { Observable } from 'rxjs'

Importação de Assunto

No RxJS versão 5, o assunto deve ser incluído da seguinte forma -

import { Subject} from 'rxjs/Subject'

No RxJS versão 6, as importações serão as seguintes -

import { Subject } from 'rxjs'

Como usar operadoras no RxJS 6?

pipe() methodestá disponível no observável criado. Ele é adicionado ao RxJS a partir da versão 5.5. Usando pipe () agora você pode trabalhar em vários operadores juntos em ordem sequencial. É assim que os operadores eram usados no RxJS versão 5.

Exemplo

import "rxjs/add/observable/from";
import 'rxjs/add/operator/max'

let list1 = [1, 6, 15, 10, 58, 2, 40];
from(list1).max((a,b)=>a-b).subscribe(x => console.log("The Max value is "+x));

Do RxJS versão 5.5 em diante, temos que usar o pipe () para executar o operador -

Exemplo

import { from } from 'rxjs';
import { max } from 'rxjs/operators';

from(list1).pipe(max((a,b)=>a-b)).subscribe(x => console.log(
   "The Max value is "+x)
);

Operadores renomeados

Durante a reestruturação dos pacotes, alguns dos operadores foram renomeados porque estavam em conflito ou correspondiam a palavras-chave javascript. A lista é mostrada abaixo -

Operador	Renomeado para
Faz()	toque()
pegar()	catchError ()
interruptor()	switchAll ()
finalmente()	finalizar()
lançar()	throwError ()