在Angular中Promise和Observable之间有什么区别?

每一个例子都有助于理解这两种情况。在什么情况下,我们可以使用每种情况?


当前回答

许诺

Promise在异步操作完成或失败时处理单个事件。

注意:有Promise库支持取消,但ES6 Promise目前还没有。

可观察的

Observable就像一个流(在许多语言中),允许传递零个或多个事件,并为每个事件调用回调。

与Promise相比,Observable通常更受欢迎,因为它提供了Promise等特性。使用Observable,无论您想处理0、1或多个事件。您可以在每种情况下使用相同的API。

Observable也比Promise具有可取消的优势。如果不再需要对服务器的HTTP请求或其他昂贵的异步操作的结果,则Observable的Subscription允许取消订阅,而Promise最终将调用成功或失败回调,即使您不再需要通知或它提供的结果。

当Promise立即启动时,Observable只有在您订阅它时才会启动。这就是为什么Observable被称为lazy。

Observable提供了map、forEach、reduce等运算符。。。类似于阵列

还有一些强大的运算符,如retry()或replay()。。。这通常很方便。rxjs附带的操作员列表

惰性执行允许在通过订阅执行可观察到的操作之前建立一个运算符链,以进行更具声明性的编程。

其他回答

承诺:

异步事件处理程序-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等。

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在异步操作完成或失败时处理单个事件。

承诺在应用程序中自动执行,而可观测则是惰性的。所以我们必须订阅可观测值以返回数据。

我们不能取消订阅承诺。与可取消订阅的Observables相比,它们每次都会执行。

以下是承诺和可观察性的一些重要区别。

许诺

仅发射单个值不可取消不可共享始终异步

可观察的

发出多个值仅在调用或有人订阅时执行可以取消可以由多个订阅者共享和订阅该共享值。所有订阅者都将在一个时间点执行。可能是异步的

为了更好地理解,请参阅https://stackblitz.com/edit/observable-vs-promises

Observables和Promise帮助我们使用JavaScript/TypeScript中的异步功能。它们在许多情况下非常相似,但它们之间仍有一些差异。