Javatpoint Logo
Javatpoint Logo

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:

RxJS buffer() Transformation Operator

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:

RxJS buffer() Transformation Operator
Next TopicRxJS Operators




Youtube For Videos Join Our Youtube Channel: Join Now

Help Others, Please Share

facebook twitter pinterest

Learn Latest Tutorials


Preparation


Trending Technologies


B.Tech / MCA