Question

takeWhile

函数签名: takeWhile(predicate: function(value, index): boolean): Observable

发出值，直到提供的表达式结果为 false 。

示例

示例 1: 使用限定条件取值

( StackBlitz | jsBin | jsFiddle )

// RxJS v6+
import { of } from 'rxjs';
import { takeWhile } from 'rxjs/operators';

// 发出 1,2,3,4,5
const source = of(1, 2, 3, 4, 5);
// 允许值发出直到 source 中的值大于4，然后便完成
const example = source.pipe(takeWhile(val => val <= 4));
// 输出: 1,2,3,4
const subscribe = example.subscribe(val => console.log(val));

示例 2: takeWhile() 和 filter() 的区别

( StackBlitz | jsBin | jsFiddle )

// RxJS v6+
import { of } from 'rxjs';
import { takeWhile, filter } from 'rxjs/operators';

// 发出 3, 3, 3, 9, 1, 4, 5, 8, 96, 3, 66, 3, 3, 3
const source = of(3, 3, 3, 9, 1, 4, 5, 8, 96, 3, 66, 3, 3, 3);

// 允许值通过直到源发出的值不等于3，然后完成
// 输出: [3, 3, 3]
source
  .pipe(takeWhile(it => it === 3))
  .subscribe(val => console.log('takeWhile', val));

// 输出: [3, 3, 3, 3, 3, 3, 3]
source
  .pipe(filter(it => it === 3))
  .subscribe(val => console.log('filter', val));

相关食谱

• 智能计数器

其他资源

• takeWhile :newspaper: - 官方文档
• 使用 takeWhile 完成流 :video_camera: :dollar: - John Linquist

---

源码: https://github.com/ReactiveX/rxjs/blob/master/src/internal/operators/takeWhile.ts