rx在c语言中,rxjs操作符：of和from

最新推荐文章于 2022-12-30 15:36:25 发布

weixin_39739846

最新推荐文章于 2022-12-30 15:36:25 发布

阅读量807

点赞数

文章标签： rx在c语言中

本文详细介绍了RxJS中`of`和`from`两个操作符的使用方法。`of`用于创建发出指定参数的简单Observable，而`from`则能将各种类型的数据（如数组、Promise、事件等）转化为Observable。文中通过实例展示了如何使用这两个操作符，并提到了相关扩展操作符如`fromPromise`和`fromEvent`，帮助理解它们在实际开发中的应用。

摘要由CSDN通过智能技术生成

感觉of操作符在快速创建Observable的时候挺方便的，使用from在进行一些转化的，对这两个操作符进行整理一下。

操作符of1

12public static of(values: ...T, scheduler: Scheduler): Observable

```

创建一个Observable，它会一次发出提供的参数，最后发出完成通知。

这个静态操作符用于创建简单的Observable，该Observable只发出给定的参数，在发送完这些参数后发出完成通知。它可以用来和其他的Observables组合比如说`concat`。默认情况下，使用`null`调度器，这意味着`next`通知是同步发出的，尽管使用不同的调度器可以决定这些通知何时送到。

例如：

``` js

of(1, 2, 3).subscribe(res => {

console.log(res);

});

// 控制台依次输出：1， 2， 3

可以使用concat和其他Observable组合，例如：

7const ofListObs = of(1, 2, 3);

const strObs = of('a', 'b', 'c');

const intervalObs = interval(500);

const resObs = concat(ofListObs, strObs, intervalObs);

resObs.subscribe(res => {

console.log(res);

});

依次先发出1、2、3、a、b、c，然后一秒发出一个数字。

操作符 from1public static from(ish: ObservableInput, scheduler: Scheduler): Observable

从一个数组、类数组对象、promise、迭代器对象或者类Observable对象创建一个Observable。

几乎可以把任何东西都能转化为Observable。

将数组转化为Observable

从一般数组转化：

4from([1, 2, 3]).subscribe(res => {

console.log(res);

});

// 输出1， 2， 3

将Observable转化为Observable：

6from([of(1, 2, 3), of('a', 'b', 'c')]).pipe(

concatAll(),

).subscribe(res => {

console.log(res);

});

// 依次输出：1， 2， 3，a, b, c

将字符串转化为Observable1

4from('test').subscribe(res => {

console.log(res);

});

// 依次输出test

将一个无限迭代器转化为Observable

创建一个无限迭代器：

7static * generateDoubles(seed) {

let i = seed;

while (true) {

yield i;

i = 2 * i;

}

通过from转化迭代器为Observable(只取迭代器的前十个)：

7const iterator = OfFromComponent.generateDoubles(3);

from(iterator).pipe(

take(10),

).subscribe(res => {

console.log(res);

});

// 依次输出 3 6 12 24 48 96 192 384 768 1536

从promise转化1

3from(new Promise(resolve => resolve('hello'))).subscribe(res => {

console.log(res);

});

从集合中转化1

7const m = new Map();

m.set({a: '3'}, 'hi');

m.set({b: 4}, 'tony');

from(m).subscribe(res => {

console.log(res);

});

// 依次输出：[{"a":"3"},"hi"], [{"b":4},"tony"]

扩展：fromPromise、fromEvent、fromEventPattern

除了通用的from操作符，还有fromPromise专门处理Promise转换Observable，以及fromEvent专门处理事件转换Observable。

fromPromise1public static fromPromise(promise: PromiseLike, scheduler: Scheduler): Observable

将promise转化为Observable.

返回一个仅仅发出Promise resolve过的值然后完成的Observable。

如果Promise resolve一个值，输出Observable发出这个值然后完成。如果Promise被rejected，输出Observable后发生相应的错误。

12fromPromise(fetch('http://www.mxnzp.com/api/weather/current/%E6%B7%B1%E5%9C%B3')).subscribe(

res => {

if (res.status === 200) {

res.json().then(r => {

console.log(r);

});

}

err => {

console.log('err', err);

}

);

fetch方法比较特殊，返回一个Promise，然后json()后继续Promise.then()才可以拿到接口的返回值。

fromEvent1public static fromEvent(target: EventTargetLike, eventName: string, options: EventListenerOptions, selector: SelectorMethodSignature): Observable

创建一个Observable，该Observable发出来自给定事件对象的指定类型事件。

创建一个来自于DOM事件，或者Node的EventEmitter事件或其他事件的Observable。

通过给“事件目标”添加时间监听器的方式创建Observable，可能会是拥有addEventListener和removeEventListener方法的对象，一个Node.js的EventEmitter，一个jQuery式的EventEmitter，一个Dom的节点集合，或者Dom的HTMLCollection。Observable被订阅的时候事件处理函数会被添加，当取消订阅的时候会将事件处理函数移除。

| 名称 | 类型 | 属性 | 描述 |

| ——– | —–: | :—-: |:—-: |

4fromEvent(document, 'click').subscribe(x => {

console.log('click', x);

});

// 发出dom document上的点击事件，每次点击时，都会在控制台发出 MouseEvent

对上面的程序进行扩展，点击页面上的任何地方，出现一个小东西，0.5s后消失：