Подтвердить что ты не робот

Что такое труба для rxJS

Я думаю, что у меня есть базовая концепция, но есть некоторые неясности

Итак, в общем, так я использую наблюдаемое:

observable.subscribe(x => {

})

Если я хочу фильтровать данные, я могу использовать это:

import { first, last, map, reduce, find, skipWhile } from 'rxjs/operators';
observable.pipe(
    map(x => {return x}),
    first()
    ).subscribe(x => {

})

Я также могу это сделать:

import 'rxjs/add/operator/map';
import 'rxjs/add/operator/first';

observable.map(x => {return x}).first().subscribe(x => {

})

Итак, мои вопросы:

  • В чем разница?
  • Если нет никакой разницы, почему существует функциональный канал?
  • Почему эти функции нуждаются в разных импортах?
4b9b3361

Ответ 1

Операторы "pipable" (бывшие "lettable") - это текущий и рекомендуемый способ использования операторов начиная с RxJS 5.5.

Я настоятельно рекомендую вам прочитать официальную документацию https://github.com/ReactiveX/rxjs/blob/master/doc/pipeable-operators.md

Основное различие заключается в том, что проще создавать пользовательские операторы и лучше использовать деревья, не изменяя некоторый глобальный объект Observable который мог бы создавать коллизии, если две разные стороны хотели создать оператор с одинаковым именем.

Использование отдельного оператора import для каждого оператора 'rxjs/add/operator/first' было способом создания небольших пакетов приложений. Импортируя только нужные вам операторы вместо всей библиотеки RxJS, вы можете значительно уменьшить общий размер пакета. Однако компилятор не может знать, импортировали ли вы 'rxjs/add/operator/first' потому что он вам действительно нужен в вашем коде или вы просто забыли удалить его при рефакторинге кода. Это одно из преимуществ использования переносимых операторов, когда неиспользуемый импорт игнорируется автоматически.

Ответ 2

Трубный метод

Все это выглядит круто, но все еще очень многословно. Что ж, благодаря RxJS 5.5 наблюдаемых теперь есть доступный метод pipe для экземпляров, позволяющий вам очистить код выше, вызывая pipe со всеми нашими чистыми операторами функций:

Что это значит?

Это означает, что любые операторы, которые вы ранее использовали в экземпляре наблюдаемого, доступны как чистые функции в rxjs/operators. Это делает создание группы операторов или повторное использование операторов становится действительно легким, без необходимости прибегать ко всем видам гимнастики программирования, где вам нужно создать настраиваемую наблюдаемую расширяющуюся Наблюдаемую, а затем перезаписать лифт только для того, чтобы создать свою собственную вещь.

const { Observable } = require('rxjs/Rx')
const { filter, map, reduce,  } = require('rxjs/operators')
const { pipe } = require('rxjs/Rx')

const filterOutEvens = filter(x => x % 2)
const doubleBy = x => map(value => value * x);
const sum = reduce((acc, next) => acc + next, 0);
const source$ = Observable.range(0, 10)

source$.pipe(
  filterOutEvens, 
  doubleBy(2), 
  sum)
  .subscribe(console.log); // 50