23. mergeMap: параллельные задачи

mergeMap — параллельно и без порядка

Первый из четырёх flattening-операторов. mergeMap(projectFn) делает две вещи:

Для каждого входящего значения вызывает projectFn и получает внутренний Observable.
Сразу подписывается на этот внутренний Observable и пропускает значения наружу.

Важно: внешний поток не ждёт. Если приходит новое значение, запускается ещё один внутренний Observable, и оба работают параллельно.

Когда выбирать mergeMap

Задачи независимы — порядок неважен.
Параллельная загрузка файлов или независимые сохранения.
Нужно дождаться все результаты, а не «последний победил».

Главная особенность

Порядок результатов не сохраняется. Если первая задача длиннее второй, второй результат придёт первым.

Глоссарий

Внешний поток — тот, на который вы навесили mergeMap.
Внутренний поток — тот, который вернула projectFn для конкретного значения.

Что нужно сделать

В pipe добавьте mergeMap(value => timer(value * 20).pipe(map(() => 'Done ' + value))).
Источник выдаёт 3, 1, 2 — каждое порождает таймер своей длительности.
Поскольку 1 короче 3, результат Done 1 придёт раньше Done 3. Это и есть «без сохранения порядка».

Детерминированная проверка

В этой задаче проверка идет через виртуальное время TestScheduler. Если решение верное, в консоли появится только Test Passed!. Не добавляйте лишние console.log, иначе проверка провалится.

Решение spoiler · click to reveal

const { of, timer, mergeMap, map } = Rx;

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

const result$ = source$.pipe(
  mergeMap(value => {
    return timer(value * 20).pipe(
      map(() => 'Done ' + value)
    );
  })
);

script.ts // TypeScript

CONSOLE · Console Output

Нажмите на запуск, чтобы увидеть результат...