前言
RxJS 是一个强大的响应式编程库，它提供了许多操作符来处理数据流。其中，组合操作符是非常重要的一类，它们可以将多个 Observable 合并成一个，从而实现更复杂的逻辑。本文将介绍 RxJS 中的两个常用组合操作符：merge 和 concat。
merge
merge 操作符可以将多个 Observable 合并成一个，它的语法如下：
merge<T>(...observables: (ObservableInput<T> | SchedulerLike)[]): Observable<T>
其中，observables 是一个可变参数，可以传入多个 Observable。merge 操作符会将这些 Observable 中的数据流合并成一个，然后将合并后的数据流发射出去。
下面是一个示例代码，演示了如何使用 merge 操作符：
-- -------------------- ---- ------- ------ - ------ -- - ---- ------- ----- ---- - ----- -- --- ----- ---- - ----- -- --- ----- ---- - ----- -- --- ----- --------- - ----------- ----- ------ ------------------------- -- --------------------
输出结果为：
-- -------------------- ---- ------- - - - - - - - - -
可以看到，merge 操作符将三个 Observable 中的数据流合并成了一个，并按照时间顺序依次发射出去。
需要注意的是，merge 操作符不保证合并后的数据流顺序，也就是说，合并后的数据流可能会出现交错的情况。因此，在使用 merge 操作符时，需要特别注意数据流的顺序。
concat
concat 操作符也可以将多个 Observable 合并成一个，但它的合并方式与 merge 不同。concat 操作符会按照顺序依次连接 Observable，等待前一个 Observable 完成后再连接下一个 Observable。它的语法如下：
concat<T>(...observables: (ObservableInput<T> | SchedulerLike)[]): Observable<T>
下面是一个示例代码，演示了如何使用 concat 操作符：
-- -------------------- ---- ------- ------ - ------- -- - ---- ------- ----- ---- - ----- -- --- ----- ---- - ----- -- --- ----- ---- - ----- -- --- ----- --------- - ------------ ----- ------ ------------------------- -- --------------------
输出结果为：
-- -------------------- ---- ------- - - - - - - - - -
可以看到，concat 操作符按照顺序依次连接了三个 Observable，并依次发射出了它们的数据流。
需要注意的是，如果其中一个 Observable 没有完成，那么它后面的 Observable 将无法连接。因此，在使用 concat 操作符时，需要特别注意每个 Observable 的完成情况。
总结
merge 和 concat 是 RxJS 中常用的组合操作符，它们可以将多个 Observable 合并成一个，实现更复杂的逻辑。需要注意的是，merge 操作符不保证合并后的数据流顺序，而 concat 操作符按照顺序依次连接 Observable。在使用这两个操作符时，需要特别注意数据流的顺序和完成情况。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/658d4ab7eb4cecbf2d33ef2a