All you need to know about the debounce operator RxJS

The debounce operator emits a value from the source Observable only after a particular time span determined by another Observable has passed. After the time span it emits the last value emitted by the source observable.


debounce(durationSelector: Function): MonoTypeOperatorFunctiondurationSelector: It is a function that receives the time span value from the source observable and stops emitting input values till the time span is elapsed.MonoTypeOperatorFunction: It is a function that returns an observable as output.

An example of the debounce operator is given below.

const source = of( 1 , 2 , 3 , 4 , 5 , 6 );const result = source.pipe(debounce(() => interval( 2000 )));result.subscribe(val => console.log(val));

Here we take an observable that emits values through the “of” operator. Then on it we apply the debounce operator with the interval operator with time set to 2000ms. By the time the interval operator emits its value, the source observable completes its emissions. So the output of the above operation is 6 which is the last value emitted by the source observable.