携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第7天，点击查看活动详情
过滤类操作符
debounceTime
debounceTime是防抖操作符，它的功能和debounce防抖函数差不多。只有在特定的一段时间经过后并且没有发出另一个源值，才从源 Observable 中发出一个值。有什么使用场景呢？例如，当用户在输入框里输入的时候，根据用户输入的关键字搜索，下拉框里会显示这些搜索结果，但是用户还在输入过程中，我们不希望去搜索，而是在用户输入完毕后在进行搜索，可以设置用户输入停止后超过500毫秒，则认为用户输入完毕，这时候去搜索。
const { interval, take, debounceTime } = require('rxjs');
const source$ = interval(1000).pipe(take(5));
source$.pipe(debounceTime(2000)).subscribe((x) => {
console.log(x);
});
console.log('End');
End
4
throttleTime
有防抖肯定就有节流，throttleTime是节流操作符，和throttle函数差不多。它会控制一定时间内只会发送一个数据，多余的数据会直接被抛弃掉。
实际上，防抖和节流有点类似，那两者的最大的区别是什么呢？最大的区别在于第一个值生效，还是最后一个值生效。防抖是最后一个值生效，节流是第一个值生效。
const source$ = interval(1000).pipe(take(5));
source$.pipe(throttleTime(2000)).subscribe((x) => {
console.log(x);
});
console.log('End');
End
0
3
如果你对防抖节流熟悉的话，那这两个操作符分分钟就会用了，否则又要花很多时间去理解这两个概念，这就是为什么平时的日常学习积累是多么的重要啊。 现在问题来了，你可以徒手写一个防抖函数，和一个节流函数吗？
filter
filter操作符比较简单，和js中数组的filter功能差不多，日常工作中使用很多但很简单，这里跳过了。
distinct
distinct操作符也比较简单，会把数据去重。
const source$ = of(1,2,6,3,1,2,7);
source$.pipe(distinct()).subscribe((x) => {
console.log(x);
});
console.log('End');
take
这个操作符可以获得前n个发出的值，后面的值会被自动忽略，在之前的例子里用的挺多的，也比较简单，这里就不在赘述了。
skip
skip操作符是跳过发出的前n个值。
const source$ = of(1,2,6,3,1,2,7);
source$.pipe(skip(4)).subscribe((x) => {
console.log(x);
});
console.log('End');
1
2
7
End
还有很多其他的过滤类的操作符，这里不一一介绍了，本篇文章只介绍了我在日常工作中常用的一些操作符，如果有需要的可以查阅官网文档。
