在Angular中Promise和Observable之间有什么区别?
每一个例子都有助于理解这两种情况。在什么情况下,我们可以使用每种情况?
在Angular中Promise和Observable之间有什么区别?
每一个例子都有助于理解这两种情况。在什么情况下,我们可以使用每种情况?
当前回答
我相信所有其他的答案都会消除你的疑虑。然而,我只是想补充一点,可观测性是基于函数式编程的,我发现它附带的函数非常有用,比如map、flatmap、reduce、zip。web实现的一致性,尤其是当它依赖于API请求时,是一种残酷的改进。
我强烈推荐这个文档,因为它是reactiveX的官方文档,我发现它是最清晰的。
如果你想了解可观测性,我建议你写一篇三部分的文章:http://blog.danlew.net/2014/09/15/grokking-rxjava-part-1/
虽然它是针对RxJava的,但概念是相同的,而且解释得很好。在reactiveX文档中,您拥有每个函数的等效项。您必须查找RxJS。
其他回答
Promise和Observable都在Angular(typescript)中用于处理异步数据,但它们的用法和行为不同。
承诺:是一次性事件(解决/拒绝)返回单个值(解析或拒绝一次)处理单个异步事件无取消和无插座
用例示例:错误处理和恢复/处理顺序操作/组件间通信
import { HttpClient } from '@angular/common/http';
constructor(private http: HttpClient) {}
fetchData() {
return new Promise((resolve, reject) => {
this.http.get('https://api.examplepromise.com/data')
.toPromise()
.then(data => resolve(data))
.catch(error => reject(error));
});
}
观察结果:一段时间内可以发出多个值的值流只要流处于活动状态,就可以订阅并发出值。处理多个异步事件可以取消并支持socket/mapreducer(ngrx)操作用例示例:监控输入元素的变化/动画和转换/使用RxJS进行集中状态管理/取消用户输入以限制API调用
块引用
import { fromEvent } from 'rxjs';
constructor(private elementRef: ElementRef) {}
listenToButtonClicks() {
fromEvent(this.elementRef.nativeElement, 'click')
.subscribe(event => console.log(event));
}
承诺:
异步事件处理程序-Promise对象表示异步操作的最终完成(或失败)及其结果值。
语法:new Promise(executor);
例如:
var promise_eg = new Promise(function(resolve, reject) {
setTimeout(function() {
resolve('foo');
}, 300);
});
promise_eg.then(function(value) {
console.log(value);
// expected output: "foo"
});
console.log(promise_eg);
关于Promise:
它有一个管道,因此在调用时只返回一次值。它是一个单向处理程序,因此一旦调用,您可能无法取消。可以在when()和then()之间使用有用的语法。
观察结果:
可观测值是一段时间内多个值的惰性集合。这是一种非常好的异步操作方法。它可以用具有跨平台支持的rxjs实现,也可以与Angular/React等一起使用。
它的作用类似于流衬垫,可以是多管道。因此,一旦定义,您可以在许多地方订阅以获得返回结果。
语法:从“@reactivex/rxjs”导入*作为Rx;初始化:
Rx.Observable.fromEvent(button, "click"),
Rx.Subject()
etc.
订阅:RxLogger.getInstance();
例如:
import { range } from 'rxjs';
import { map, filter } from 'rxjs/operators';
range(1, 200).pipe(
filter(x => x % 2 === 1),
map(x => x + x)
).subscribe(x => console.log(x));
由于它支持多管道,您可以在不同的位置订阅结果,
它有比承诺更多的可能性。
用法:
它有更多的可能性,如贴图、过滤器、管道、贴图、concatMap等。
我总结了以下差异,
可观察:
Observable只是一个函数,它接受一个观察者并返回一个函数observer:一个带有下一个错误的对象。Observer允许订阅/取消订阅其数据流,发出下一个值,通知观察者错误和通知观察者流完成情况Observer提供了一个函数来处理下一个值、错误和流结束(UI事件、http响应、带有web套接字的数据)。随着时间的推移使用多个值它可以取消/重试,支持map、filter、reduce等运算符。创建Observable可以是-Observable.create()-返回可在-ObservatorObservable.from()-将数组或可迭代对象转换为-ObservableObservable.fromEvent()-将事件转换为Observable-Observable.fromPromise()-将Promise转换为Observable-Observable.range()-返回指定范围内的整数序列
承诺:
一个承诺代表着一项未来将完成的任务;承诺通过价值来解决;承诺被例外拒绝;不可取消,并返回单个值承诺暴露函数(然后)-然后返回一个新的承诺;-允许基于状态-处理程序保证按照所附的顺序执行;
Promise在异步活动完成或失败时发出单个事件。
Observable类似于流(在许多语言中),允许传递至少零个或多个事件,其中每个事件都需要回调。
与Promise相比,Observable通常更受欢迎,因为它提供了Promise等的亮点。使用Observable,您是否需要处理0、1或各种事件并不重要。您可以针对每种情况使用类似的API。
承诺:promise只产生一种价值
例如:
const numberPromise = new Promise((resolve) => {
resolve(5);
resolve(10);
});
numberPromise.then(value => console.log(value));
// still prints only 5
可观察:在一段时间内发出多个值
例如:
const numberObservable = new Observable((observer) => {
observer.next(5);
observer.next(10);
});
numberObservable.subscribe(value => console.log(value));
// prints 5 and 10
我们可以想象一个可观察的流,它在一段时间内发出多个值,对发出的每个项调用相同的回调函数。无论该数据是作为单个值还是作为多个值在某段时间内传输。
承诺:
承诺不是懒惰承诺不能取消
可观察:
可观察就是懒惰。“可观察”是缓慢的。直到我们订阅了它。可以使用unsubscribe()方法取消Observable另外,Observable提供了许多强大的运算符,foreach、filter、reduce、retry、retryWhen等。
角度承诺与可观测
承诺只针对单一价值或解决方案。可观测数据是数据流。可观的东西可以取消,但承诺不能取消。
至少对我来说,最鲜为人知的是:
承诺总是异步的,但可观测可以是同步的和异步的。
如果你想详细了解它,我写了一篇关于这个答案的博客文章——JavaScript中Observables和Promise之间的4个区别