[Перевод] Что нового в RxJS v6.5

15 ИЮНЯ 2022

------------------------------------------------------------------------

Наш телеграм-канал: t.me/@mailsgun_online

Youtube: youtube.com/@mailsgun_online

------------------------------------------------------------------------

  • Перевод

В этом посте мы поговорим о новых возможностях и доработках последней версии RxJS 6.5.0.

Новый оператор fromFetch

Теперь RxJS предоставляет встроенную поддержку нативного fetch API, включая возможность прерывать запросы при помощи AbortController.

import { of } from 'rxjs';
import { switchMap, catchError } from 'rxjs/operators';
import { fromFetch } from 'rxjs/fetch';
const users$ = fromFetch('https://reqres.in/api/users').pipe(
  switchMap(response => {
    if (response.ok) {
      return response.json();
    } else {
      return of({ error: true, message: `Error ${response.status}` });
    }
  }),
  catchError((error) => of({ error: true, message: error.message }))
);
users$.subscribe({ next(data) { ... }, complete() { ... } });

Усовершенствованный оператор forkJoin

Это мне понравилось больше всего. Оператор forkJoin теперь принимает словарь источников:

import { forkJoin, timer } from 'rxjs';
import { take, mapTo } from 'rxjs/operators';
const source = forkJoin({
  todos: timer(500).pipe(mapTo([{ title: 'RxJS'}])),
  user: timer(500).pipe(mapTo({ id: 1 }))
});
source.subscribe({
  next({ todos, user }) { }
});

Кроме того, использование данного оператора в виде  forkJoin(a, b, c, d) признано устаревшим, вместо этого нужно писать forkJoin([a, b, c, d]).

// DEPRECATED
forkJoin(of(1), of(2)).subscribe();
// use an array instead
forkJoin([of(1), of(2)]).subscribe();

Partition Observable

Существующий оператор partition теперь считается устаревшим, и на его место приходит новый порождающий observable-оператор partition.
Partition разделяет объект-источник на два объекта типа observable, один — для значений, которые удовлетворяют заданному предикату, и второй — для значений, которые не удовлетворяют.

import { fromEvent, partition } from 'rxjs';
const clicks$ = fromEvent(document, 'click');
const [clicksOnH1$, clicksElsewhere$] =
  partition(clicks$, event => event.target.tagName === 'H1');
clicksOnH1$.subscribe({
  next() { console.log('clicked on h1') }
});
clicksElsewhere$
  .subscribe({
    next() {
      console.log('Other clicked')
    }
  });

combineLatest переведен в статус deprecated

В новой версии больше не используются сигнатуры combineLatest, за исключением combineLatest([a, b, c]). О причинах такого изменения читайте здесь.

Планировщики

Используйте оператор scheduled, чтобы сконфигурировать планировщик для существующего observable. Планируемые (те, которые принимают планировщик в качестве параметра) версии операторов from, range и других признаны устаревшими.

import { of, scheduled, asapScheduler } from 'rxjs';
console.log(1);
// DEPRECATED
// of(2, asapScheduler).subscribe({
//   next(value) {
//     console.log(value);
//   }
// });
scheduled(of(2), asapScheduler).subscribe({
  next(value) {
    console.log(value);
  }
});
console.log(3)

Наша команда создает крутой инструмент TestMace — мощная IDE для работы с API. Создавайте сценарии, тестируйте эндпоинты и пользуйтесь всей мощью продвинутого автодополнения и подсветки синтаксиса. Пишите нам! Мы тут: Telegram, Slack, Facebook, Vk

Теги:

Похожие публикации

Source: habr1

Ну и напоследок напоминаю вам о нашем новом проекте vkserfing bot.