RxJS是web中热门的库之一,
* 它提供强⼤的功能性⽅法来处理事件 简化代码
* 一方面很有用,很好用,一方面学习 RxJS 和响应式编程很难,
* 它有着众多的概念,⼤量的表层 API 和从 命令式到声明式⻛格的思维转换
* 以下是一些较常用到的API
一、关于发出值的操作
1.interval
间隔给定时间发出数字序列
只能传入一个参数
const source = Rx.Observable.interval(1000);
const subscribe = source.subscribe(
val => console.log(val)
);
// 每隔1s发出从0开始的数字
// 0 1 2 3 ……
2.timer
间隔给定时间发出数字序列
可传入多个参数
第一个参数,表示第一次间隔的时间;
第二个参数,表示第二次间隔的时间;
第三个参数,表示第三次间隔的时间;
最后一个参数,表示值后间隔的时间
const sourceTime = Rx.Observable.timer(1000, 2000);
3.delay
延迟N时间 后发出值
const source = Rx.Observable.delay(3000);
4.delayWhen
满足条件才发出值
const message = Rx.Observable.interval(1000);
const delayForFiveSeconds = () => Rx.Observable.timer(5000);
const delayWhenExample = message.delayWhen(delayForFiveSeconds);
const subscribe = source.subscribe(
val => console.log(val)
);
// 5s后发出 1 2 3 ……
5.of
按顺序发出值
const source = Rx.Observable.of(
{name: 'HELLO'},
[1, 2, 3],
function hello() { return 'hello'; }
);
const subscribe = source.subscribe(
val => console.log(val)
);
// 输出: {name: 'Brian}, [1,2,3], function hello() { return 'Hello' }
二、关于对已经发出的值进行操作
6.take
从发出的值中选择前N个
const source = Rx.Observable.interval(1000);
const example = source.take(5);
const subscribe = example.subscribe(
val => console.log(val)
);
// 0 1 2 3 4
7.map
此处的map作用和js中是一样的
//js:
var array = [1, 4, 9, 16];
const newArray = array.map(x => x * 2);
// newArray : [2, 8, 18, 32]
// rxjs:
const source = Rx.Observable.map([1, 2, 3, 4, 5]);
const example = source.map(val => val + 10);
const subscribe = example.subscribe(
val => console.log(val)
); // 11,12,13,14,15
8.mapTo
将发出的每一个元素,转化成指定的信息
const source = Rx.Observable.interval(2000);
const example = source.mapTo('Hello World');
const subscribe = example.subscribe(
val => console.log(val)
);
//Hello World Hello World Hello World ……
9.combineAll
将所有发出的值组合后,一次性发出
const source = Rx.Observable.intervabl(1000).take(5).map(val => val + 10);
const example = source.combineAll();
const subscribe = example.subscribe(
val => console.log(val)
);
10.combineLatest
把最后一个值组合起来作为数组发出
const source1 = Rx.observable.interval(1000).take(2);
const source2 = Rx.observable.interval(1000).take(5);
const example = Rx.Observable.combineLatest(source1, source2);
每次分享10个,循序渐进,嘻嘻
网友评论