RxJS：Observables

observable是创建观察者并将其附加到源的源函数，例如，单击，来自dom元素或Http请求的鼠标事件等期望值的源。

Observer是具有回调函数的对象，当与Observable发生交互时将调用该对象，即，源已交互了示例按钮单击，Http请求等。

我们将在本章中讨论以下主题：

• 创建Observable
• 订阅Observable
• 执行Observable

创建Observable

可以使用observable构造函数以及observable create方法并通过将subscription函数作为参数传递给observ来创建observable，如下所示：

testrx.js

import { Observable } from 'rxjs';

var observable = new Observable(
   function subscribe(subscriber) {
      subscriber.next("My First Observable")
   }
);

我们已经创建了一个Observable，并添加使用消息“My First Observable” 。

我们还可以使用Observable.create()方法创建Observable，如下所示：

testrx.js

import { Observable } from 'rxjs';
var observer = Observable.create(
   function subscribe(subscriber) {
      subscriber.next("My First Observable")
   }
);

订阅Observable

您可以按照以下方式订阅Observable：

testrx.js

import { Observable } from 'rxjs';

var observer = new Observable(
   function subscribe(subscriber) {
      subscriber.next("My First Observable")
   }
);
observer.subscribe(x => console.log(x));

订阅Observable后，它将开始执行Observable。

这是我们在浏览器控制台中看到的：

执行Observable

Observable对象在订阅时被执行。Observable是具有三种方法的对象，这些方法会被通知，

next() -此方法将发送数字，字符串，对象等值。

complete() -此方法将不发送任何值，并指示可观察到的已完成。

error() -此方法将发送错误（如果有）。

让我们用所有三个通知创建可观察对象并执行相同的操作。

testrx.js

import { Observable } from 'rxjs';
var observer = new Observable(
   function subscribe(subscriber) {
      try {
         subscriber.next("My First Observable");
         subscriber.next("Testing Observable");
         subscriber.complete();
      } catch(e){
         subscriber.error(e);
      }
   }
);
observer.subscribe(x => console.log(x), (e)=>console.log(e), 
   ()=>console.log("Observable is complete"));

在上面的代码中，我们添加了下一个complete和error方法。

try{
   subscriber.next("My First Observable");
   subscriber.next("Testing Observable");
   subscriber.complete();
} catch(e){
   subscriber.error(e);
}

要执行下一步，完成和错误，我们必须调用如下所示的subscribe方法：

observer.subscribe(x => console.log(x), (e)=>console.log(e), 
   ()=>console.log("Observable is complete"));

仅当出现错误时，才会调用error方法。

这是在浏览器中看到的输出：