在 RxJS 中的 buffer 操作符允许收集传入时窗口内的多个数据，并将其作为单个数组发出。这个操作符可以在处理异步数据流时非常有用，但是需要注意一些点。
1. Buffer 操作符的语法
buffer(bufferBoundaries: Observable<any>): Observable<T[]>;
buffer 会创建一个新的 Observable ，它从源 Observable 中发射数据，并将每个发射数据聚合到缓冲区中。缓冲区于一个 Observable ，它的生命期与 bufferBoundaries 中的每个 observable 相对应。当任何一个触发事件时，缓冲区中的数据被发出并清空缓冲区。
2. Window 操作符的语法
window(windowBoundaries: Observable<any>): Observable<Observable<T>>;
window 操作符会将源 Observable 中的数据按照 windowBoundaries 中的 observable 分成多个子集，即子 Observable。然后，这些子 Observable 被发送到输出 Observable 上，与原始 Observable 中的数据相同。
3. Buffer 操作符的示例
-- -------------------- ---- ------- ------ - ------ - ---- ----------------- ------ - -------- - ---- ------- ----- ------ - --------------- ----- ---------------- - --------------- ----- ------- - -------------------------------------- -- ------- --------------------------------------------------------------- ----- ---------- - -------------------------------展开代码
在上面的例子中，我们创建了一个间隔为 1 秒的源 Observable，和一个间隔为 5 秒的 observable 作为边界。每 5 秒将数据发送到缓冲区中，然后清空缓冲区，并将缓冲区中的数据作为一个数组发出。
4. Window 操作符的示例
-- -------------------- ---- ------- ------ - ------ - ---- ----------------- ------ - -------- - ---- ------- ----- ------ - --------------- ----- ---------------- - --------------- ----- ------- - -------------------------------------- -- ------- -------------------------------------------- ----- ---------- - --------------------- -- - ----- --------------- - --------------------------- ------------- -- ------------------------------ ------ ---展开代码
在上面的例子中，我们创建了一个间隔为 1 秒的源 Observable ，和一个间隔为 5 秒的 observable 作为边界。我们创建了一个窗口，在 5000ms 后，一个新的窗口被开启。当一个新的窗口开启时，之前窗口中的子 Observable 自动被关闭并且清除。在每个窗口的持续时间内，我们可以处理这些子 Observable 中的值。
5. 确保使用正确的 Observable 边界
在使用 buffer 和 window 操作符时，我们需要确保使用正确的 observable 作为边界。在大多数情况下，我们需要考虑使用 timer() 或 interval() Observable 作为边界，但是我们可以使用其他的 observable 作为边界，例如 click 事件，ajax 完成等。在选择边界时，我们需要考虑到.Observable所需的行为是否与我们需要的操作匹配。
6. 小结
在 RxJS 中的 buffer 和 window 操作符允许我们将多个值聚合到一个数组或子 Observable 中，这对于处理异步数据流非常有用。要确保选择正确的 observable 作为边界，以便获得期望的结果。
-- -------------------- ---- ------- ------ - ------ - ---- ----------------- ------ - -------- - ---- ------- ----- ------ - --------------- ----- ---------------- - --------------- ----- ------- - -------------------------------------- -- ------- --------------------------------------------------------------- ----- ---------- - -------------------------------展开代码
最后，可以使用 buffer 和 window 操作符来对异步数据流进行操作，实现更加灵活的异步数据处理。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67bfa68d0c976d473a467ff4
