Promise发出单个值，Observable发出多个值。因此，在处理HTTP请求时，Promise可以管理同一请求的单个响应，但是如果同一请求有多个响应，那么我们就必须使用Observable。是的，Observable可以处理同一请求的多个响应。

许诺

const promise = new Promise((data) =>
{ data(1);
  data(2);
  data(3); })
.then(element => console.log(‘Promise ‘ + element));

输出

Promise 1

可观察的

const observable = new Observable((data) => {
data.next(1);
data.next(2);
data.next(3);
}).subscribe(element => console.log('Observable ' + element));

输出

Observable 1
Observable 2
Observable 3

关于这个话题已经有很多答案了，所以我不会再赘述。

但是对于刚开始学习Observable/Aangular并想知道与Promise相比使用哪一个的人来说，我建议您将所有内容都保持Observable，并将项目中所有现有的Promise转换为Observable。

因为Angular框架本身及其社区都在使用Observable。因此，当您集成框架服务或第三方模块并将所有内容链接在一起时，这将是有益的。

当然，没有任何意见在所有情况下都是100%正确的，但至少我认为98%的时间是在Angular框架中实现的常规商业项目，Observable是正确的选择。

即使你在开始你的简单爱好项目时不喜欢它，你很快就会意识到你在Angular中与之交互的几乎所有组件，而且大多数Angular友好的第三方框架都使用Observables，然后你会不断地将Promise转换为Observable，以便与它们进行通信。

这些组件包括但不限于：HttpClient、表单生成器、Angular材质模块/对话框、Ngrx存储/效果和ngx引导。

事实上，我在过去两年中处理的Angular生态系统中唯一的Promise是APP_INITIALIZER。

承诺与可观察到的相似性

两者都用于处理异步代码。请查看承诺示例。promise构造函数传递一个解析引用函数，当它在完成某个异步任务时被某个值调用时，该函数将被调用。const promise=new promise（解析=>{setTimeout（（）=>{决心（“来自承诺的问候！”）；}, 2000);});promise.then（值=>console.log（值））；现在是一个可观的例子。在这里，我们还将一个函数传递给observable——一个处理异步任务的观察者。与promise中的resolve不同，它具有以下方法并订阅以代替then。所以两者都处理异步任务。现在让我们看看区别。const observable=新的observable（观察者=>{setTimeout（（）=>{observer。next（“来自Observable的您好！”）；}, 2000);});observable.subscribe（value=>console.log（value））；

承诺与显著差异

许诺

它解析或拒绝单个值，并且可以一次处理单个值的异步任务。一个promise一旦解析了它完成的异步值，就不能再使用了。它只是一次性使用，在这里它是不够的。不可取消操作员不支持rxjs。

可观察的

能够发出多个异步值。用于处理事件或值流。假设您有一个包含大量任务或值的数组，并且您希望每次将值插入其中时都能自动处理。每当您将一个值推送到这个数组中时，它的所有订阅者都会自动收到最新的值。Observable可用于观察输入更改、重复间隔、向所有子组件广播值、web套接字推送通知等。可以随时使用退订方法取消。承诺的最后一个好部分是支持rxjs运算符。在订阅之前，您有许多管道操作符（主要是map、filter、switchMap、combineLatest等）来转换可观察数据。

Promise和Observables将帮助我们使用JavaScript中的异步功能。它们在许多情况下非常相似，但是，两者之间仍然存在一些差异，承诺是以HTTP调用等异步方式解析的值。另一方面，可观测性处理一系列异步事件。它们之间的主要区别如下：

承诺：

有一条管道通常仅用于异步数据返回不容易取消

可观察：

可取消本质上是可重新测试的，例如重试和retryWhen多个管道中的流数据具有类似数组的操作，如map、filter等可以从其他来源（如事件）创建它们是功能，稍后可以订阅

此外，我为您创建了下图，以直观地显示差异：

Promise和Observables都帮助我们处理异步操作。当这些异步操作完成。Angular使用RxJS中的Observables而不是承诺来处理HTTP

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

我刚刚处理了一个问题，Promise是最好的解决方案，我将在这里分享给任何在有用的情况下遇到这个问题的人（这正是我之前寻找的答案）：

在Angular2项目中，我有一个服务，它接受一些参数并返回一个值列表来填充表单上的下拉菜单。当表单组件初始化时，我需要使用不同的参数多次调用同一个服务来定义多个不同的下拉菜单，但是如果我只是将所有变量排队来调用该服务，只有最后一个成功，其余的错误都出来了。从数据库提取的服务一次只能处理一个请求。

成功填充所有下拉菜单变量的唯一方法是调用服务，以防止在最后一个请求完成之前处理新请求，Promise/.then机制很好地解决了这个问题。

  fetchValueList(listCode): Promise<any> {
      return this.dataSvc.getValueList(listCode, this.stateSvc.currentContext, this.stateSvc.currentLanguageCode)
          .map(response => response.json())
          .toPromise();
  }

  initializeDropDowns() {
      this.fetchValueList('First-Val-List')
          .then(data => {
              this.firstValList = data;
              return this.fetchValueList('Second-Val-List')
          }).then(data => {
              this.secondValList = data;
              return this.fetchValueList('Third-Val-List')
          }).then(data => {
              this.thirdValList = data;
          })  }

我在组件中定义了函数，然后在ngOnInit中调用initializeDropDowns（）。

fetchValueList函数返回Promise，因此第一个调用传递第一个listCode，当Promise解析时，返回值位于.then块中的数据变量中，我们可以将其分配给this.firstValList变量。当函数返回数据时，我们知道服务已经完成，可以使用第二个listCode再次调用，返回值在next.then块中的数据变量中，我们将其分配给this.secondValList变量。

我们可以根据需要将其链接多次，以填充所有变量，在最后一个代码块上，我们只需省略return语句，块就终止了。

这是一个非常具体的用例，其中我们有一个单独的服务，需要在组件初始化时多次调用，并且服务必须完成其获取并返回一个值，然后才能再次调用，但在这种情况下，Promise/.then方法是理想的。