RxJS bufferTime() Transformation Operator

The RxJS bufferTime() operator is a transformation operator similar to bufferCount() operator. It is used to buffer the emitted data of the originating Observable for a specific time period and collects values from the past as an array, and emits those arrays periodically in time.

It takes mainly two types of arguments:

1. It takes an argument named bufferTimeSpan, which specifies the amount of time to fill each buffer array. It collects the values from the observable on which it is called and emit the bufferTimeSpan is done. The buffer data is emitted, and the buffer is reset once the amount of time specified is over.
2. It also takes an argument named bufferCreationInterval, which specifies the time span for which the buffer data builds up. The operator opens the buffer every bufferCreationInterval milliseconds and emits and resets every bufferTimeSpan

The unit for the time span is specified in milliseconds.

Syntax:

Following is the syntax of the bufferTime() operator:

Parameter Explanation

bufferTimeSpan: It specifies the amount of time to fill each buffer array.

Return value

The bufferTime() operator's return value is an observable that will have an array of buffered values.

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

Example 1

Output:

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

In the above example, you can see that a new number appeared every 2 seconds in the arrays that are emitted, while the rest of the emitted arrays are empty.

Example 2 (Using bufferCreationInterval argument)

Output:

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

In the above example, we have set the buffer time interval for 2 second where the buffered data is emitted every second, and the buffer is created every second.