RxJS merge() Join Operator

The RxJS merge() operator is a join operator that is used to turn multiple observables into a single observable. It creates an output Observable, which concurrently emits all values from every given input Observables.

In other words, we can say that the merge() operator includes the multiple Observables together by blending their values into one Observable.

Syntax:

Following is the syntax of the concat() operator:

Parameter Explanation

observable: It specifies that the input given will be an array of Observable.

Return value

The merge() operator's return value is a single observable that gives a single value as output, which includes every input Observable result.

Let us see some examples of merge() operator to understand it clearly.

Example 1 (Simple Example to Merge two lists)

import { of, merge } from 'rxjs';
import { concat } from 'rxjs/operators';
let list1 = of(1, 2, 3, 4, 5);
let list2 = of(4, 5, 6, 7, 8, 9, 10)
let final_val = merge(list1, list2);
final_val.subscribe(x => console.log(x));

Output:

After executing the above example, you will see the following result:

In the above example, you can see that the merge() operator has included the both lists in one result as output.

Example 2 (Merging multiple observables using Static Method)

import { mapTo } from 'rxjs/operators';
import { interval, merge } from 'rxjs';
//emit every 4 seconds
const first = interval(4000);
//emit every 3 seconds
const second = interval(3000);
//emit every 2 seconds
const third = interval(2000);
//emit every 1 second
const fourth = interval(1000);
//emit outputs from one observable
const example = merge(
  first.pipe(mapTo('FIRST!')),
  second.pipe(mapTo('SECOND!')),
  third.pipe(mapTo('THIRD')),
  fourth.pipe(mapTo('FOURTH'))
);

Output:

After executing the above example, you will see the following result:

Example 3 (Merging 2 Observables using Instance Method)

import { merge } from 'rxjs/operators';
import { interval } from 'rxjs';
//emit every 4 seconds
const first = interval(4000);
//emit every 2 second
const second = interval(2000);
//used as instance method
const example = first.pipe(merge(second));
const subscribe = example.subscribe(val => console.log(val));

Output:

After executing the above example, you will see the following result: