RxJS buffer() Transformation Operator
The RxJS buffer() operator is a transformation operator that buffers the source Observable values until closingNotifier emits. It takes an argument as an observable and starts buffering the values emitted on its original observable in an array and then emit the same when the observable taken as argument emits. When the observable taken as arguments is emitted, the buffer is reset and started buffering again on the original value till the input observable emits. This scenario repeats itself.
In other words, we can say that the buffer() operator collects values from the past as an array and emits that array only when another Observable emits.
Syntax:
Following is the syntax of the race() operator:
Parameter Explanation
input_observable: It specifies that the argument for this operator is arrays of Observable that will make the buffer emit values. For example, button click.
Return value
The buffer() operator’s return value is observable that will have an array of buffered values.
Let us see some examples of buffer() operator to understand it clearly.
Example 1 (buffer will recognize double clicks)
In this example, we are going to use a button click which will collect the clicks that occur after 500ms and emit array of clicks. See the following example:
Output:
After executing the above example, you will see the following result:
Example 2 (Buffer until document click)
In the following example, we are going to use a button click as an observable input to buffer. The buffer will be called on the original observable at the interval of 1 second. The buffer will collect the clicks passed in the time interval given. See the following example:
Output:
After executing the above example, you will see the following result:
