RxJS - 轉換運算子 bufferCount

對於 buffercount 運算子，它會收集呼叫該運算子的可觀察物件中的值，並且當 buffercount 中給出的緩衝區大小相匹配時會發出該值。它採用 2 個引數buffersize，第二個是 startBufferEvery，即它會從 startBufferEvery（如果給出）中計數新值，否則會從源可觀察物件的開頭計數。

語法

bufferCount(bufferSize: number, startBufferEvery: number = null): Observable

引數

bufferSize − 要發出的緩衝區大小。

返回值

將返回一個可觀察物件，它將包含一個緩衝值陣列。

我們將看到一個 bufferCount() 的工作示例

示例 1

import { fromEvent } from 'rxjs';
import { bufferCount } from 'rxjs/operators';

let btn = document.getElementById("btnclick");

let btn_clicks = fromEvent(btn, 'click');
let buffered_array = btn_clicks.pipe(bufferCount(4));
buffered_array.subscribe(arr => console.log(arr));

在以上示例中，bufferSize 為 4。因此，在點選計數為 4 後，點選事件陣列將收集到一個數組中並顯示出來。由於我們沒有給出 startBufferEvery，因此將從一開始進行計數。

輸出

示例 2

import { fromEvent } from 'rxjs';
import { bufferCount } from 'rxjs/operators';

let btn = document.getElementById("btnclick");
let btn_clicks = fromEvent(btn, 'click');
let buffered_array = btn_clicks.pipe(bufferCount(4, 2));
buffered_array.subscribe(arr => console.log(arr));

在此示例中，我們添加了 startBufferEvery，因此在每次點選 2 次後，它將顯示 4 次點選事件的緩衝計數。

輸出