angular - RxJs 中的“new Observable()”和“of()”有什么区别
问题描述
new Observable()
in和of()
in和有什么不一样RxJs
?
在我的测试用例中,当我尝试返回时new Observable()
,它给了我一个有线错误,如果我用of()
来自 Rxjs 的替换它,它工作正常。
我的印象是Observable.create()
,new Observable()
并且of()
做同样的事情。
someService.getMethod().pipe(
...
catchError((e) => {
// some operation
// return new Observable(false as any); // ----> creates error
return of(false as any); // this works perfectly
})
)
解决方案
Observable.create()
并且new Observable()
基本上做同样的事情。
Rx.Observable.create
是 的别名Observable
constructor
,它有一个参数:subscribe
函数。
Observable.of
, 另一方面是关于 的static
方法Observable
。它为您创建一个,它会Observable
立即一个接一个地发出您指定为参数的值,然后发出一个完整的通知。
您的实施存在问题:
您对自定义 Observable 的实现是错误的。当你new
创建一个 Observable 时,你必须将一个subscribe
函数传递给它constructor
,它有一个observer
作为 arg 的函数。这observer
有类似next
,error
和complete
之类的方法,这些方法会在该 observable 的生命周期中的那些特定实例处被调用。
您还应该公开一个Subscription
具有unsubscribe
方法的对象,然后消费者可以使用该方法进行任何清理。
以下是它的一般实现方式:
const yourCustomObservable = new Observable((observer) => {
observer.next("This pushes new value to the consumer");
observer.error("This pushes an error to the consumer");
observer.complete();
return function unsubscribe() {
// When the consumer unsubscribes, clean up data ready for next subscription.
};
});
对于您的特定用例,您可以使用:
new Observable(...)
:
import { Observable } from 'rxjs';
...
someService.getMethod().pipe(
...
catchError((e) => {
// some operation
return new Observable(observer => observer.next(false));
})
)
Observable.create
:
import { Observable } from 'rxjs';
...
someService.getMethod().pipe(
...
catchError((e) => {
// some operation
return Observable.create(observer => observer.next(false));
})
)
of
:
import { of } from 'rxjs';
...
someService.getMethod().pipe(
...
catchError((e) => {
// some operation
return of(false);
})
)
from
:
import { from } from 'rxjs';
...
someService.getMethod().pipe(
...
catchError((e) => {
// some operation
return from([false]);
})
)
查看此示例 StackBlitz以获取参考。
什么时候用什么?
new Observable(...)
或Observable.create(...)
为您提供更精细的控制,您可以在其中定义自己的subscribe
功能并在其中做任何您想做的事情。因此,您可能希望使用它来实现通常无法static
使用Observable
. 但是,对于像您这样的简单用例,使用Observable.of
orObservable.from
就足够了。
推荐阅读
- javascript - 为什么这些转换后的画布在某些分辨率下不能以 chrome 完整呈现?
- vue.js - vue 组件在兄弟姐妹中检测自己的索引
- javascript - 创建网站页面实时外观的图像
- ballerina - Ballerina:拉新发行版后不兼容的依赖关系
- javascript - React hooks:使用 Promise 设置属性会导致所有 obj 属性在 useState 中更改的效果吗?
- asp.net-mvc - ASP。NET MVC 控制器即使在注销后仍保留以前的 ClaimsPrincipal(使用 OWIN 中间件)
- excel - 删除VBA中列中第一个'-'之前的所有数据
- python-3.x - BeautifulSoup 仅识别出 25 个条目中的 5 个
- python - 在 docker 映像上运行 .jar 文件失败并出现错误:“错误:无法访问 jarfile file.jar”
- python - Python 在 Google App Script 中获取 Properties Service 数据