13. pipe и map

pipe — конвейер для значений

До этого мы создавали Observable и сразу подписывались. Но обычно между источником и подпиской нужно что-то сделать: отфильтровать, преобразовать, отложить. Для этого есть метод pipe(...).

Представьте pipe как ленту с несколькими станциями. Значение входит в первую станцию, она его обрабатывает, результат уходит на вторую, и так далее. До подписчика добирается результат всех станций.

source$.pipe(op1, op2, op3).subscribe(...)
// 1 → op1 → op2 → op3 → подписчик

map — самое частое преобразование

Оператор map(fn) принимает каждое значение, передаёт его в функцию fn и пропускает дальше то, что она вернула. Это полный аналог Array.prototype.map, только работает с потоком во времени.

of(1, 2, 3).pipe(map(x => x * 10))
// 1 → map → 10
// 2 → map → 20
// 3 → map → 30

const { of, map } = Rx;

const source$ = of(1, 2, 3);

const result$ = source$.pipe(
  map(value => value * 10)
);

result$.subscribe(value => console.log(value));