可观察对象只允许你订阅，而主题允许你同时发布和订阅。

因此，主题允许您的服务同时用作发布者和订阅者。

到目前为止，我不太擅长Observable，所以我只分享一个Subject的例子。

让我们用一个Angular CLI的例子来更好地理解。执行如下命令:

npm install -g @angular/cli

ng new angular2-subject

cd angular2-subject

ng serve

将app.component.html的内容替换为:

<div *ngIf="message">
  {{message}}
</div>

<app-home>
</app-home>

执行命令ng g c components/home生成home组件。将home.component.html的内容替换为:

<input type="text" placeholder="Enter message" #message>
<button type="button" (click)="setMessage(message)" >Send message</button>

#message是这里的局部变量。添加属性消息:string; 到app.component.ts的类。

执行命令ng g s service/message。这将在src\app\service\message.service.ts上生成一个服务。向应用程序提供此服务。

将Subject导入MessageService。也要添加一个主题。最终的代码应该是这样的:

import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';

@Injectable()
export class MessageService {

  public message = new Subject<string>();

  setMessage(value: string) {
    this.message.next(value); //it is publishing this value to all the subscribers that have already subscribed to this message
  }
}

现在，将这个服务注入到home.component.ts中，并将它的一个实例传递给构造函数。对app.component.ts也这样做。使用这个服务实例将#message的值传递给服务函数setMessage:

import { Component } from '@angular/core';
import { MessageService } from '../../service/message.service';

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.css']
})
export class HomeComponent {

  constructor(public messageService:MessageService) { }

  setMessage(event) {
    console.log(event.value);
    this.messageService.setMessage(event.value);
  }
}

在app.component.ts中，向Subject订阅和取消订阅(以防止内存泄漏):

import { Component, OnDestroy } from '@angular/core';
import { MessageService } from './service/message.service';
import { Subscription } from 'rxjs/Subscription';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html'
})
export class AppComponent {

  message: string;
  subscription: Subscription;

  constructor(public messageService: MessageService) { }

  ngOnInit() {
    this.subscription = this.messageService.message.subscribe(
      (message) => {
        this.message = message;
      }
    );
  }

  ngOnDestroy() {
    this.subscription.unsubscribe();
  }
}

就是这样。

现在，在home.component.html的#message中输入的任何值都将被打印到app.component.html中的{{message}}

行为主体vs可观察对象:RxJS有观察者和可观察对象，RxJS提供了多个用于数据流的类，其中一个是行为主体。

可观察对象:可观察对象是多个值随时间变化的惰性集合。

BehaviorSubject:一个需要初始值并将其当前值发送给新订阅者的Subject。

 // RxJS v6+
import { BehaviorSubject } from 'rxjs';

const subject = new BehaviorSubject(123);

//two new subscribers will get initial value => output: 123, 123
subject.subscribe(console.log);
subject.subscribe(console.log);

//two subscribers will get new value => output: 456, 456
subject.next(456);

//new subscriber will get latest value (456) => output: 456
subject.subscribe(console.log);

//all three subscribers will get new value => output: 789, 789, 789
subject.next(789);

// output: 123, 123, 456, 456, 456, 789, 789, 789

观察:每个观察者的结果不同

一个非常非常重要的区别。因为Observable只是一个函数，它没有任何状态，所以对于每个新的Observer，它都会一次又一次地执行可观察对象的创建代码。结果是:

为每个观察者运行代码 ． 如果它是一个HTTP调用，它会被每个观察者调用

这会导致主要的错误和低效率

BehaviorSubject(或Subject)存储观察者细节，只运行一次代码，并将结果提供给所有观察者。

Ex:

JSBin： http://jsbin.com/qowulet/edit?js,console

// --- Observable --- let randomNumGenerator1 = Rx.Observable.create(observer => { observer.next(Math.random()); }); let observer1 = randomNumGenerator1 .subscribe(num => console.log('observer 1: '+ num)); let observer2 = randomNumGenerator1 .subscribe(num => console.log('observer 2: '+ num)); // ------ BehaviorSubject/ Subject let randomNumGenerator2 = new Rx.BehaviorSubject(0); randomNumGenerator2.next(Math.random()); let observer1Subject = randomNumGenerator2 .subscribe(num=> console.log('observer subject 1: '+ num)); let observer2Subject = randomNumGenerator2 .subscribe(num=> console.log('observer subject 2: '+ num)); <script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.5.3/Rx.min.js"></script>

输出:

"observer 1: 0.7184075243594013"
"observer 2: 0.41271850211336103"
"observer subject 1: 0.8034263165479893"
"observer subject 2: 0.8034263165479893"

观察如何使用Observable。create为每个观察者创建了不同的输出，但BehaviorSubject为所有观察者提供了相同的输出。这很重要。

总结了其他差异。

┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┳━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
┃         Observable                  ┃     BehaviorSubject/Subject         ┃      
┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━╋━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫ 
┃ Is just a function, no state        ┃ Has state. Stores data in memory    ┃
┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━╋━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
┃ Code run for each observer          ┃ Same code run                       ┃
┃                                     ┃ only once for all observers         ┃
┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━╋━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
┃ Creates only Observable             ┃Can create and also listen Observable┃
┃ ( data producer alone )             ┃ ( data producer and consumer )      ┃
┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━╋━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
┃ Usage: Simple Observable with only  ┃ Usage:                              ┃
┃ one Obeserver.                      ┃ * Store data and modify frequently  ┃
┃                                     ┃ * Multiple observers listen to data ┃
┃                                     ┃ * Proxy between Observable  and     ┃
┃                                     ┃   Observer                          ┃
┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┻━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛

你也可以像这样将一个主题更改为一个可观察对象:

 page = new BehaviorSubject<String|null>(null);
 actualPage:Observable<string> = new Observable()

this.page.next("hardware")
this.actualPage = this.page as Observable<any>;

可观察对象和主体都是可观察对象，这意味着观察者可以跟踪它们。它们都有一些独特的特点。有三种类型的科目，每一种也有独特的特点。

您可以在stackblitz上找到实际示例。 (您需要检查控制台以查看实际输出)

观察

它们是冷的:当它们至少有一个观察者时，代码就会被执行。

创建数据副本:Observable为每个观察者创建数据副本。

单向:观察者不能给观察对象赋值(源/主)。

主题

它们很热:即使没有观察者，代码也会被执行，值也会被传播。

共享数据:在所有观察者之间共享相同的数据。

双向:观察者可以给观察对象赋值(源/主)。

如果你正在使用subject，那么你会错过所有在创建观察者之前传播的值。这就是重放主题

ReplaySubject

它们很热:即使没有观察者，代码也会被执行，值也会被传播。

共享数据:在所有观察者之间共享相同的数据。

双向:观察者可以给观察对象赋值(源/主)。+

重播消息流:无论您何时订阅重播主题，您都将收到所有的广播消息。

在Subject和ReplaySubject中，不能将初始值设置为observable。这就是行为主体…

BehaviorSubject

它们很热:即使没有观察者，代码也会被执行，值也会被传播。

共享数据:在所有观察者之间共享相同的数据。

双向:观察者可以给观察对象赋值(源/主)。+

重播消息流:无论您何时订阅重播主题，您都将收到所有的广播消息。

你可以设置初始值:你可以用默认值初始化可观察对象。

Observable对象表示一个基于推的集合。

观察者和可观察接口为基于推送的通知提供了一种通用机制，也称为观察者设计模式。Observable对象表示发送通知的对象(提供者);Observer对象表示接收它们的类(观察者)。

Subject类继承了Observable和Observer，也就是说它既是一个观察者又是一个可观察对象。您可以使用主题订阅所有观察者，然后将主题订阅到后端数据源

var subject = new Rx.Subject();

var subscription = subject.subscribe(
    function (x) { console.log('onNext: ' + x); },
    function (e) { console.log('onError: ' + e.message); },
    function () { console.log('onCompleted'); });

subject.onNext(1);
// => onNext: 1

subject.onNext(2);
// => onNext: 2

subject.onCompleted();
// => onCompleted

subscription.dispose();

更多信息https://github.com/Reactive-Extensions/RxJS/blob/master/doc/gettingstarted/subjects.md