48f7bafbb2e36638988289a873a6a4f5770eaafeb21b825039074fc055793b11623b66b24195330216f8849e0c92d0d211c23eb058c40fe587982a1a07fd7c 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. import { Observable } from '../Observable';
  2. import { ObservableInputTuple, SchedulerLike } from '../types';
  3. import { concatAll } from '../operators/concatAll';
  4. import { popScheduler } from '../util/args';
  5. import { from } from './from';
  6. export function concat<T extends readonly unknown[]>(...inputs: [...ObservableInputTuple<T>]): Observable<T[number]>;
  7. export function concat<T extends readonly unknown[]>(
  8. ...inputsAndScheduler: [...ObservableInputTuple<T>, SchedulerLike]
  9. ): Observable<T[number]>;
  10. /**
  11. * Creates an output Observable which sequentially emits all values from the first given
  12. * Observable and then moves on to the next.
  13. *
  14. * <span class="informal">Concatenates multiple Observables together by
  15. * sequentially emitting their values, one Observable after the other.</span>
  16. *
  17. * ![](concat.png)
  18. *
  19. * `concat` joins multiple Observables together, by subscribing to them one at a time and
  20. * merging their results into the output Observable. You can pass either an array of
  21. * Observables, or put them directly as arguments. Passing an empty array will result
  22. * in Observable that completes immediately.
  23. *
  24. * `concat` will subscribe to first input Observable and emit all its values, without
  25. * changing or affecting them in any way. When that Observable completes, it will
  26. * subscribe to then next Observable passed and, again, emit its values. This will be
  27. * repeated, until the operator runs out of Observables. When last input Observable completes,
  28. * `concat` will complete as well. At any given moment only one Observable passed to operator
  29. * emits values. If you would like to emit values from passed Observables concurrently, check out
  30. * {@link merge} instead, especially with optional `concurrent` parameter. As a matter of fact,
  31. * `concat` is an equivalent of `merge` operator with `concurrent` parameter set to `1`.
  32. *
  33. * Note that if some input Observable never completes, `concat` will also never complete
  34. * and Observables following the one that did not complete will never be subscribed. On the other
  35. * hand, if some Observable simply completes immediately after it is subscribed, it will be
  36. * invisible for `concat`, which will just move on to the next Observable.
  37. *
  38. * If any Observable in chain errors, instead of passing control to the next Observable,
  39. * `concat` will error immediately as well. Observables that would be subscribed after
  40. * the one that emitted error, never will.
  41. *
  42. * If you pass to `concat` the same Observable many times, its stream of values
  43. * will be "replayed" on every subscription, which means you can repeat given Observable
  44. * as many times as you like. If passing the same Observable to `concat` 1000 times becomes tedious,
  45. * you can always use {@link repeat}.
  46. *
  47. * ## Examples
  48. *
  49. * Concatenate a timer counting from 0 to 3 with a synchronous sequence from 1 to 10
  50. *
  51. * ```ts
  52. * import { interval, take, range, concat } from 'rxjs';
  53. *
  54. * const timer = interval(1000).pipe(take(4));
  55. * const sequence = range(1, 10);
  56. * const result = concat(timer, sequence);
  57. * result.subscribe(x => console.log(x));
  58. *
  59. * // results in:
  60. * // 0 -1000ms-> 1 -1000ms-> 2 -1000ms-> 3 -immediate-> 1 ... 10
  61. * ```
  62. *
  63. * Concatenate 3 Observables
  64. *
  65. * ```ts
  66. * import { interval, take, concat } from 'rxjs';
  67. *
  68. * const timer1 = interval(1000).pipe(take(10));
  69. * const timer2 = interval(2000).pipe(take(6));
  70. * const timer3 = interval(500).pipe(take(10));
  71. *
  72. * const result = concat(timer1, timer2, timer3);
  73. * result.subscribe(x => console.log(x));
  74. *
  75. * // results in the following:
  76. * // (Prints to console sequentially)
  77. * // -1000ms-> 0 -1000ms-> 1 -1000ms-> ... 9
  78. * // -2000ms-> 0 -2000ms-> 1 -2000ms-> ... 5
  79. * // -500ms-> 0 -500ms-> 1 -500ms-> ... 9
  80. * ```
  81. *
  82. * Concatenate the same Observable to repeat it
  83. *
  84. * ```ts
  85. * import { interval, take, concat } from 'rxjs';
  86. *
  87. * const timer = interval(1000).pipe(take(2));
  88. *
  89. * concat(timer, timer) // concatenating the same Observable!
  90. * .subscribe({
  91. * next: value => console.log(value),
  92. * complete: () => console.log('...and it is done!')
  93. * });
  94. *
  95. * // Logs:
  96. * // 0 after 1s
  97. * // 1 after 2s
  98. * // 0 after 3s
  99. * // 1 after 4s
  100. * // '...and it is done!' also after 4s
  101. * ```
  102. *
  103. * @see {@link concatAll}
  104. * @see {@link concatMap}
  105. * @see {@link concatMapTo}
  106. * @see {@link startWith}
  107. * @see {@link endWith}
  108. *
  109. * @param args `ObservableInput`s to concatenate.
  110. */
  111. export function concat(...args: any[]): Observable<unknown> {
  112. return concatAll()(from(args, popScheduler(args)));
  113. }