(1) take
渔人决定只取竹筒中的前三条, 因为怕竭泽而渔.
- var source = Rx.Observable.interval(1000);
- var example = source.take(3);
- example.subscribe({
- next: (value) => { console.log(value); },
- error: (err) => { console.log('Error:' + err); },
- complete: () => { console.log('complete'); }
- });
- // 0
- // 1
- // 2
- // complete
- (2) first
first 同 take(1)是一个意思, 表示只取第一条鱼
- var source = Rx.Observable.interval(1000);
- var example = source.first();
- example.subscribe({
- next: (value) => { console.log(value); },
- error: (err) => { console.log('Error:' + err); },
- complete: () => { console.log('complete'); }
- });
- // 0
- // complete
- (3) takeUntil
takeUntil 是当渔人从竹筒中取鱼时, 当遇到一条特殊的鱼 (比如遇到一条金色的金龙鱼) 之后, 就不会再取了. 因为再取就不太吉利, 就会得罪龙王了(参照《西游记》第 XX 篇).
(4) concatAll()
把两竹筒的鱼串联合并成一竹筒的鱼然后取出.
- (5) skip
- var source = Rx.Observable.interval(1000);
- var example = source.skip(3); // 忽略竹筒中的前几条鱼, 然后取后面的鱼
- example.subscribe({
- next: (value) => { console.log(value); },
- error: (err) => { console.log('Error:' + err); },
- complete: () => { console.log('complete'); }
- });
- // 3
- // 4
- // 5...
- (6)takeLast()
- var source = Rx.Observable.interval(1000).take(6);
- var example = source.takeLast(2); // 表示只取竹筒中的最后两条鱼
- example.subscribe({
- next: (value) => { console.log(value); },
- error: (err) => { console.log('Error:' + err); },
- complete: () => { console.log('complete'); }
- });
- // 4
- // 5
- // complete
- (7) last()
- var source = Rx.Observable.interval(1000).take(6);
- var example = source.last(); // 相当于就是 takeLast(1), 表示只取竹筒中最后一条鱼
- example.subscribe({
- next: (value) => { console.log(value); },
- error: (err) => { console.log('Error:' + err); },
- complete: () => { console.log('complete'); }
- });
- // 5
- // complete
- (8) concat(observable1,observable2,....)
同样是把所有的竹筒串起来, 然后把鱼取出来
- var source = Rx.Observable.interval(1000).take(3);
- var source2 = Rx.Observable.of(3)
- var source3 = Rx.Observable.of(4,5,6)
- var example = source.concat(source2, source3); // 与 concatAll()不同的 concatAll([observale1,observable2...])中是数组, 而 concat(observable1,observable2,....)中是一个一个的参数
- example.subscribe({
- next: (value) => { console.log(value); },
- error: (err) => { console.log('Error:' + err); },
- complete: () => { console.log('complete'); }
- });
- // 0
- // 1
- // 2
- // 3
- // 4
- // 5
- // 6
- // complete
- (9) startWith()
可能当天捕到的鱼不是很多, 不够岸边的饥民吃. 渔人就偷偷在竹筒前面塞几条进去, 假装今天捕到了很多鱼, 然后取出.
- var source = Rx.Observable.interval(1000);
- var example = source.startWith(0); // 渔人变了一条鱼塞在前面
- example.subscribe({
- next: (value) => { console.log(value); },
- error: (err) => { console.log('Error:' + err); },
- complete: () => { console.log('complete'); }
- });
- // 0
- // 0
- // 1
- // 2
- // 3...
- (10)scan
当需要对所有的捕捉到的鱼做一个统计时, 比如统计所有鱼的总重量, 就需要扫描 (scan) 每一条鱼称重, 并且用上一条的重量加上下一条的重量, 如此累计.
- var source = Rx.Observable.from('hello')
- .zip(Rx.Observable.interval(600), (x, y) => x);
- var example = source.scan((origin, next) => origin + next, '');
- example.subscribe({
- next: (value) => { console.log(value); },
- error: (err) => { console.log('Error:' + err); },
- complete: () => { console.log('complete'); }
- });
- // h
- // he
- // hel
- // hell
- // hello
- // complete
- (11) buffer,bufferCount,bufferTime
渔人觉得每捕到一条鱼就扔向岸边太累了, 他决定每过一定的时间攒够了一定数量的鱼再取出 (bufferCount(3)), 或者每过一段时间(bufferTime(1000)) 再取出筒中的鱼. 或者他甚至可以看到每当第二个筒子中捕满 5 条鱼时 var example = source.buffer(source2); , 就取出所有鱼向岸边扔出.
- var source = Rx.Observable.interval(300);
- var source2 = Rx.Observable.interval(1000);
- var example = source.buffer(source2);
- var example = source.bufferTime(1000);
- var example = source.bufferCount(3);
- example.subscribe({
- next: (value) => { console.log(value); },
- error: (err) => { console.log('Error:' + err); },
- complete: () => { console.log('complete'); }
});
(12) delay()
当捕获到一串鱼后, 渔人决定抽一支烟后再开始取出鱼
- var source = Rx.Observable.interval(300).take(5);
- var example = source.delay(500); // 渔人用 500 毫秒的时间抽完烟后再开始扔鱼
- source : --0--1--2--3--4|
- delay(500)
- example: -------0--1--2--3--4|
- delayWhen('一定条件')
- delayWhen((x) => {if(x==3) {return Rx.Observable.empty().delay(500)}}) // 当扔到第三条鱼时, 渔人决定停下来用 500 毫秒抽支烟再继续扔
- (13) debounceTime
有时候捕鱼, 鱼上钩太快, 渔人年纪大, 来不及一条一条的取. 所以他决定鱼高频上钩时不取出向岸上扔(来不及啊), 等有两条鱼上钩的时间间隔够大时, 能缓够劲来. 再一次性把之前的都取出. 两次鱼捕获的时间间隔要大于 debounceTime, 才将上一批次捕获的鱼取出, 扔向岸边.
- --1--2--3---------5-- // 3,5 之间大于 debounceTime 了, 一次取出 1,2,3 扔向岸边
- (14) throttle
在 (13) 中有时捕鱼间隔时间长, 有时捕鱼间隔时间短, 渔人可以在间隔长的时间休息后把上一批攒下的鱼取出. 但是当到了夏季捕鱼季时, 上钩的鱼根本停不下来, 渔人没法采用 debounce 策略得到休息时怎么办呢 (来一条仍一条, 渔人会累死), 所以渔人又想了一个办法, 每过 5 秒 (throttleTime(5000)) 取一条刚好上钩的鱼扔出, 或者这会没有鱼上钩就等到一会儿有鱼上钩为止, 扔出去之后再等 5 秒, 如此循环, 其他时间上钩的鱼就不管了, 反正鱼多, 够吃.
注: 对于 debounce 与 throttle 的区别详情可以参考这篇文章实例解析防抖动 (Debouncing) 和节流阀(Throttling)
- var source = Rx.Observable.interval(300).take(20);
- var example = source.throttleTime(1000);
- example.subscribe({
- next: (value) => { console.log(value); },
- error: (err) => { console.log('Error:' + err); },
- complete: () => { console.log('complete'); }
- });
- // 0
- // 4
- // 8
- // 12
- // 16
- // "complete"
- (15) distinct
逢年过节, 渔人想给百姓来点独一无二的, 每次取出鱼时只取不同种类的鱼, 让他们好过把吃日本料理的瘾. 渔人只取出品种不同的鱼, 之前出现过的鱼都抛弃掉.
- var source = Rx.Observable.from(['a', 'b', 'c', 'a', 'b'])
- .zip(Rx.Observable.interval(300), (x, y) => x);
- var example = source.distinct()
- example.subscribe({
- next: (value) => { console.log(value); },
- error: (err) => { console.log('Error:' + err); },
- complete: () => { console.log('complete'); }
- });
- // a
- // b
- // c
- // complete
- source : --a--b--c--a--b|
- distinct()
example: --a--b--c------|
来源: https://juejin.im/post/5bc887ba6fb9a05d265991d5