W3cubDocs

/RxJS

combineLatest

function stable

Combines multiple Observables to create an Observable whose values are calculated from the latest values of each of its input Observables.

`combineLatest<O extends ObservableInput<any>, R>(...observables: (O | ((...values: ObservedValueOf<O>[]) => R) | SchedulerLike)[]): Observable<R>`

Parameters

observables

Type: (O | ((...values: ObservedValueOf[]) => R) | SchedulerLike)[].

Returns

Observable<R>: An Observable of projected values from the most recent values from each input Observable, or an array of the most recent values from each input Observable.

Description

Whenever any input Observable emits a value, it computes a formula using the latest values from all the inputs, then emits the output of that formula.

combineLatest marble diagram

combineLatest combines the values from all the Observables passed as arguments. This is done by subscribing to each Observable in order and, whenever any Observable emits, collecting an array of the most recent values from each Observable. So if you pass n Observables to operator, returned Observable will always emit an array of n values, in order corresponding to order of passed Observables (value from the first Observable on the first place and so on).

Static version of combineLatest accepts either an array of Observables or each Observable can be put directly as an argument. Note that array of Observables is good choice, if you don't know beforehand how many Observables you will combine. Passing empty array will result in Observable that completes immediately.

To ensure output array has always the same length, combineLatest will actually wait for all input Observables to emit at least once, before it starts emitting results. This means if some Observable emits values before other Observables started emitting, all these values but the last will be lost. On the other hand, if some Observable does not emit a value but completes, resulting Observable will complete at the same moment without emitting anything, since it will be now impossible to include value from completed Observable in resulting array. Also, if some input Observable does not emit any value and never completes, combineLatest will also never emit and never complete, since, again, it will wait for all streams to emit some value.

If at least one Observable was passed to combineLatest and all passed Observables emitted something, resulting Observable will complete when all combined streams complete. So even if some Observable completes, result of combineLatest will still emit values when other Observables do. In case of completed Observable, its value from now on will always be the last emitted value. On the other hand, if any Observable errors, combineLatest will error immediately as well, and all other Observables will be unsubscribed.

combineLatest accepts as optional parameter project function, which takes as arguments all values that would normally be emitted by resulting Observable. project can return any kind of value, which will be then emitted by Observable instead of default array. Note that project does not take as argument that array of values, but values themselves. That means default project can be imagined as function that takes all its arguments and puts them into an array.

Examples

Combine two timer Observables

import { combineLatest, timer } from 'rxjs';

const firstTimer = timer(0, 1000); // emit 0, 1, 2... after every second, starting from now
const secondTimer = timer(500, 1000); // emit 0, 1, 2... after every second, starting 0,5s from now
const combinedTimers = combineLatest(firstTimer, secondTimer);
combinedTimers.subscribe(value => console.log(value));
// Logs
// [0, 0] after 0.5s
// [1, 0] after 1s
// [1, 1] after 1.5s
// [2, 1] after 2s

Combine an array of Observables

import { combineLatest, of } from 'rxjs';
import { delay, starWith } from 'rxjs/operators';

const observables = [1, 5, 10].map(
  n => of(n).pipe(
    delay(n * 1000),   // emit 0 and then emit n after n seconds
    startWith(0),
  )
);
const combined = combineLatest(observables);
combined.subscribe(value => console.log(value));
// Logs
// [0, 0, 0] immediately
// [1, 0, 0] after 1s
// [1, 5, 0] after 5s
// [1, 5, 10] after 10s

Use project function to dynamically calculate the Body-Mass Index

import { combineLatest, of } from 'rxjs';
import { map } from 'rxjs/operators';

const weight = of(70, 72, 76, 79, 75);
const height = of(1.76, 1.77, 1.78);
const bmi = combineLatest(weight, height).pipe(
  map(([w, h]) => w / (h * h)),
);
bmi.subscribe(x => console.log('BMI is ' + x));

// With output to console:
// BMI is 24.212293388429753
// BMI is 23.93948099205209
// BMI is 23.671253629592222

Overloads

`combineLatest(sources: [O1], resultSelector: (v1: ObservedValueOf<O1>) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

sources

Type: [O1].

resultSelector

Type: (v1: ObservedValueOf) => R.

scheduler

Optional. Default is undefined.

Type: SchedulerLike.

Returns

Observable<R>

`combineLatest(sources: [O1, O2], resultSelector: (v1: ObservedValueOf<O1>, v2: ObservedValueOf<O2>) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

sources

Type: [O1, O2].

resultSelector

Type: (v1: ObservedValueOf, v2: ObservedValueOf) => R.

scheduler

Optional. Default is undefined.

Type: SchedulerLike.

Returns

Observable<R>

`combineLatest(sources: [O1, O2, O3], resultSelector: (v1: ObservedValueOf<O1>, v2: ObservedValueOf<O2>, v3: ObservedValueOf<O3>) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

sources

Type: [O1, O2, O3].

resultSelector

Type: (v1: ObservedValueOf, v2: ObservedValueOf, v3: ObservedValueOf) => R.

scheduler

Optional. Default is undefined.

Type: SchedulerLike.

Returns

Observable<R>

`combineLatest(sources: [O1, O2, O3, O4], resultSelector: (v1: ObservedValueOf<O1>, v2: ObservedValueOf<O2>, v3: ObservedValueOf<O3>, v4: ObservedValueOf<O4>) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

sources

Type: [O1, O2, O3, O4].

resultSelector

Type: (v1: ObservedValueOf, v2: ObservedValueOf, v3: ObservedValueOf, v4: ObservedValueOf) => R.

scheduler

Optional. Default is undefined.

Type: SchedulerLike.

Returns

Observable<R>

`combineLatest(sources: [O1, O2, O3, O4, O5], resultSelector: (v1: ObservedValueOf<O1>, v2: ObservedValueOf<O2>, v3: ObservedValueOf<O3>, v4: ObservedValueOf<O4>, v5: ObservedValueOf<O5>) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

sources

Type: [O1, O2, O3, O4, O5].

resultSelector

Type: (v1: ObservedValueOf, v2: ObservedValueOf, v3: ObservedValueOf, v4: ObservedValueOf, v5: ObservedValueOf) => R.

scheduler

Optional. Default is undefined.

Type: SchedulerLike.

Returns

Observable<R>

`combineLatest(sources: [O1, O2, O3, O4, O5, O6], resultSelector: (v1: ObservedValueOf<O1>, v2: ObservedValueOf<O2>, v3: ObservedValueOf<O3>, v4: ObservedValueOf<O4>, v5: ObservedValueOf<O5>, v6: ObservedValueOf<O6>) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

sources

Type: [O1, O2, O3, O4, O5, O6].

resultSelector

Type: (v1: ObservedValueOf, v2: ObservedValueOf, v3: ObservedValueOf, v4: ObservedValueOf, v5: ObservedValueOf, v6: ObservedValueOf) => R.

scheduler

Optional. Default is undefined.

Type: SchedulerLike.

Returns

Observable<R>

`combineLatest(sources: O[], resultSelector: (...args: ObservedValueOf<O>[]) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

sources

Type: O[].

resultSelector

Type: (...args: ObservedValueOf[]) => R.

scheduler

Optional. Default is undefined.

Type: SchedulerLike.

Returns

Observable<R>

`combineLatest(v1: O1, resultSelector: (v1: ObservedValueOf<O1>) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

Type: O1.

resultSelector

Type: (v1: ObservedValueOf) => R.

scheduler

Optional. Default is undefined.

Type: SchedulerLike.

Returns

Observable<R>

`combineLatest(v1: O1, v2: O2, resultSelector: (v1: ObservedValueOf<O1>, v2: ObservedValueOf<O2>) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

v1	Type: `O1`.
v2	Type: `O2`.
resultSelector	Type: `(v1: ObservedValueOf, v2: ObservedValueOf) => R`.
scheduler	Optional. Default is `undefined`. Type: `SchedulerLike`.

Returns

Observable<R>

`combineLatest(v1: O1, v2: O2, v3: O3, resultSelector: (v1: ObservedValueOf<O1>, v2: ObservedValueOf<O2>, v3: ObservedValueOf<O3>) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

v1	Type: `O1`.
v2	Type: `O2`.
v3	Type: `O3`.
resultSelector	Type: `(v1: ObservedValueOf, v2: ObservedValueOf, v3: ObservedValueOf) => R`.
scheduler	Optional. Default is `undefined`. Type: `SchedulerLike`.

Returns

Observable<R>

`combineLatest(v1: O1, v2: O2, v3: O3, v4: O4, resultSelector: (v1: ObservedValueOf<O1>, v2: ObservedValueOf<O2>, v3: ObservedValueOf<O3>, v4: ObservedValueOf<O4>) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

v1	Type: `O1`.
v2	Type: `O2`.
v3	Type: `O3`.
v4	Type: `O4`.
resultSelector	Type: `(v1: ObservedValueOf, v2: ObservedValueOf, v3: ObservedValueOf, v4: ObservedValueOf) => R`.
scheduler	Optional. Default is `undefined`. Type: `SchedulerLike`.

Returns

Observable<R>

`combineLatest(v1: O1, v2: O2, v3: O3, v4: O4, v5: O5, resultSelector: (v1: ObservedValueOf<O1>, v2: ObservedValueOf<O2>, v3: ObservedValueOf<O3>, v4: ObservedValueOf<O4>, v5: ObservedValueOf<O5>) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

v1	Type: `O1`.
v2	Type: `O2`.
v3	Type: `O3`.
v4	Type: `O4`.
v5	Type: `O5`.
resultSelector	Type: `(v1: ObservedValueOf, v2: ObservedValueOf, v3: ObservedValueOf, v4: ObservedValueOf, v5: ObservedValueOf) => R`.
scheduler	Optional. Default is `undefined`. Type: `SchedulerLike`.

Returns

Observable<R>

`combineLatest(v1: O1, v2: O2, v3: O3, v4: O4, v5: O5, v6: O6, resultSelector: (v1: ObservedValueOf<O1>, v2: ObservedValueOf<O2>, v3: ObservedValueOf<O3>, v4: ObservedValueOf<O4>, v5: ObservedValueOf<O5>, v6: ObservedValueOf<O6>) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

v1	Type: `O1`.
v2	Type: `O2`.
v3	Type: `O3`.
v4	Type: `O4`.
v5	Type: `O5`.
v6	Type: `O6`.
resultSelector	Type: `(v1: ObservedValueOf, v2: ObservedValueOf, v3: ObservedValueOf, v4: ObservedValueOf, v5: ObservedValueOf, v6: ObservedValueOf) => R`.
scheduler	Optional. Default is `undefined`. Type: `SchedulerLike`.

Returns

Observable<R>

`combineLatest(sources: [O1], scheduler: SchedulerLike): Observable<[ObservedValueOf<O1>]>`

Parameters

sources	Type: `[O1]`.
scheduler	Type: `SchedulerLike`.

Returns

Observable<[ObservedValueOf<O1>]>

`combineLatest(sources: [O1, O2], scheduler: SchedulerLike): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>]>`

Parameters

sources	Type: `[O1, O2]`.
scheduler	Type: `SchedulerLike`.

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>]>

`combineLatest(sources: [O1, O2, O3], scheduler: SchedulerLike): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>]>`

Parameters

sources	Type: `[O1, O2, O3]`.
scheduler	Type: `SchedulerLike`.

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>]>

`combineLatest(sources: [O1, O2, O3, O4], scheduler: SchedulerLike): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>]>`

Parameters

sources	Type: `[O1, O2, O3, O4]`.
scheduler	Type: `SchedulerLike`.

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>]>

`combineLatest(sources: [O1, O2, O3, O4, O5], scheduler: SchedulerLike): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>, ObservedValueOf<O5>]>`

Parameters

sources	Type: `[O1, O2, O3, O4, O5]`.
scheduler	Type: `SchedulerLike`.

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>, ObservedValueOf<O5>]>

`combineLatest(sources: [O1, O2, O3, O4, O5, O6], scheduler: SchedulerLike): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>, ObservedValueOf<O5>, ObservedValueOf<O6>]>`

Parameters

sources	Type: `[O1, O2, O3, O4, O5, O6]`.
scheduler	Type: `SchedulerLike`.

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>, ObservedValueOf<O5>, ObservedValueOf<O6>]>

`combineLatest(sources: O[], scheduler: SchedulerLike): Observable<ObservedValueOf<O>[]>`

Parameters

sources	Type: `O[]`.
scheduler	Type: `SchedulerLike`.

Returns

Observable<ObservedValueOf<O>[]>

`combineLatest(sources: [O1]): Observable<[ObservedValueOf<O1>]>`

Parameters

sources

Type: [O1].

Returns

Observable<[ObservedValueOf<O1>]>

`combineLatest(sources: [O1, O2]): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>]>`

Parameters

sources

Type: [O1, O2].

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>]>

`combineLatest(sources: [O1, O2, O3]): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>]>`

Parameters

sources

Type: [O1, O2, O3].

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>]>

`combineLatest(sources: [O1, O2, O3, O4]): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>]>`

Parameters

sources

Type: [O1, O2, O3, O4].

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>]>

`combineLatest(sources: [O1, O2, O3, O4, O5]): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>, ObservedValueOf<O5>]>`

Parameters

sources

Type: [O1, O2, O3, O4, O5].

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>, ObservedValueOf<O5>]>

`combineLatest(sources: [O1, O2, O3, O4, O5, O6]): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>, ObservedValueOf<O5>, ObservedValueOf<O6>]>`

Parameters

sources

Type: [O1, O2, O3, O4, O5, O6].

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>, ObservedValueOf<O5>, ObservedValueOf<O6>]>

`combineLatest(sources: O[]): Observable<ObservedValueOf<O>[]>`

Parameters

sources

Type: O[].

Returns

Observable<ObservedValueOf<O>[]>

`combineLatest(v1: O1, scheduler?: SchedulerLike): Observable<[ObservedValueOf<O1>]>`

Parameters

Type: O1.

scheduler

Optional. Default is undefined.

Type: SchedulerLike.

Returns

Observable<[ObservedValueOf<O1>]>

`combineLatest(v1: O1, v2: O2, scheduler?: SchedulerLike): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>]>`

Parameters

Type: O1.

Type: O2.

scheduler

Optional. Default is undefined.

Type: SchedulerLike.

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>]>

`combineLatest(v1: O1, v2: O2, v3: O3, scheduler?: SchedulerLike): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>]>`

Parameters

v1	Type: `O1`.
v2	Type: `O2`.
v3	Type: `O3`.
scheduler	Optional. Default is `undefined`. Type: `SchedulerLike`.

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>]>

`combineLatest(v1: O1, v2: O2, v3: O3, v4: O4, scheduler?: SchedulerLike): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>]>`

Parameters

v1	Type: `O1`.
v2	Type: `O2`.
v3	Type: `O3`.
v4	Type: `O4`.
scheduler	Optional. Default is `undefined`. Type: `SchedulerLike`.

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>]>

`combineLatest(v1: O1, v2: O2, v3: O3, v4: O4, v5: O5, scheduler?: SchedulerLike): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>, ObservedValueOf<O5>]>`

Parameters

v1	Type: `O1`.
v2	Type: `O2`.
v3	Type: `O3`.
v4	Type: `O4`.
v5	Type: `O5`.
scheduler	Optional. Default is `undefined`. Type: `SchedulerLike`.

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>, ObservedValueOf<O5>]>

`combineLatest(v1: O1, v2: O2, v3: O3, v4: O4, v5: O5, v6: O6, scheduler?: SchedulerLike): Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>, ObservedValueOf<O5>, ObservedValueOf<O6>]>`

Parameters

v1	Type: `O1`.
v2	Type: `O2`.
v3	Type: `O3`.
v4	Type: `O4`.
v5	Type: `O5`.
v6	Type: `O6`.
scheduler	Optional. Default is `undefined`. Type: `SchedulerLike`.

Returns

Observable<[ObservedValueOf<O1>, ObservedValueOf<O2>, ObservedValueOf<O3>, ObservedValueOf<O4>, ObservedValueOf<O5>, ObservedValueOf<O6>]>

`combineLatest(...observables: O[]): Observable<any[]>`

Parameters

observables

Type: O[].

Returns

Observable<any[]>

`combineLatest(...observables: Array<ObservableInput<any> | ((...values: Array<any>) => R)>): Observable<R>`

Parameters

observables

Type: Array | ((...values: Array) => R)>.

Returns

Observable<R>

`combineLatest(array: O[], resultSelector: (...values: ObservedValueOf<O>[]) => R, scheduler?: SchedulerLike): Observable<R>`

Parameters

array

Type: O[].

resultSelector

Type: (...values: ObservedValueOf[]) => R.

scheduler

Optional. Default is undefined.

Type: SchedulerLike.

Returns

Observable<R>

`combineLatest(...observables: Array<O | SchedulerLike>): Observable<any[]>`

Parameters

observables

Type: Array.

Returns

Observable<any[]>

`combineLatest(...observables: Array<O | ((...values: ObservedValueOf<O>[]) => R) | SchedulerLike>): Observable<R>`

Parameters

observables

Type: Array[]) => R) | SchedulerLike>.

Returns

Observable<R>

`combineLatest(...observables: Array<ObservableInput<any> | ((...values: Array<any>) => R) | SchedulerLike>): Observable<R>`

Parameters

observables

Type: Array | ((...values: Array) => R) | SchedulerLike>.

Returns

Observable<R>