基礎概念

ReactiveX 結合了 觀察者模式、迭代器模式 和 使用集合的函數語言程式設計，以滿足以一種理想方式來管理事件序列所需要的一切。

在 RxJS 中用來解決非同步事件管理的的基本概念是：

• Observable (可觀察物件): 表示一個概念，這個概念是一個可呼叫的未來值或事件的集合。
• Observer (觀察者): 一個回撥函式的集合，它知道如何去監聽由 Observable 提供的值。
• Subscription (訂閱): 表示 Observable 的執行，主要用於取消 Observable 的執行。
• Operators (操作符): 採用函數語言程式設計風格的純函式 (pure function)，使用像 map
  、filter、concat、flatMap 等這樣的操作符來處理集合。
• Subject (主體): 相當於 EventEmitter，並且是將值或事件多路推送給多個 Observer 的唯一方式。
• Schedulers (排程器): 用來控制併發並且是中央集權的排程員，允許我們在發生計算時進行協調，例如 setTimeout 或 requestAnimationFrame 或其他。

  let observable = Observable.create(observer => {
      observer.next(1);
      observer.next(2);
      observer.next(3);
      observer.complete();
      observer.next(4);
    });

    console.log("just before subscribe ");

    observable.subscribe({
      next: x => console.log("next:" + x),
      error: err => console.log("error:", err),
      complete: () => console.log("done")
    });

    console.log("just after subscribe");
 

    // 建立 Observables 可觀察物件
    var observable = Observable.create(function subscribe(observer) {
      var id = setInterval(() => {
        observer.next("hi");
      }, 1000);
    });
    //訂閱 Observables 訂閱 ，subscription相當於一個訂閱者
    var subscription = observable.subscribe(x => console.log(x));
    setTimeout(() => {
      subscription.unsubscribe();
    }, 1000);
    subscription.unsubscribe();
 

 function multiplyTen(input) {
    let output = Observable.create(function subscribe(observer) {
      input.subscribe({
        next: v => observer.next(10 * v),
        error: err => observer.error(err),
        complete: () => observer.complete()
      });
    });
    return output;
  }



    var input = from([1, 2, 3, 4]);
    var output = this.multiplyTen(input);
    output.subscribe(x => console.log(x));

程式執行結果：10 20 30 40

Subscription(訂閱者)

什麼是訂閱?訂閱是表示可使用資源的物件，通常是可觀察資源的執行。訂閱有一個重要的方法，unsubscribe，它不接受引數，只處理訂閱所持有的資源。在以前的RxJS版本中，訂閱被稱為“一次性”。

Subject (主體)

RxJS主題是一種特殊的可觀測型別，它允許對許多觀察者的值進行多播。可以同時訂閱多個observe

import { Subject } from 'rxjs';
 
const subject = new Subject<number>();
 
subject.subscribe({
  next: (v) => console.log(`observerA: ${v}`)
});
subject.subscribe({
  next: (v) => console.log(`observerB: ${v}`)
});
 
subject.next(1);
subject.next(2);
 
// Logs:
// observerA: 1
// observerB: 1
// observerA: 2
// observerB: 2

Scheduler (排程器)

什麼是排程器？ - 排程器控制著何時啟動 subscription 和何時傳送通知。它由三部分組成：

• 排程器是一種資料結構。 它知道如何根據優先順序或其他標準來儲存任務和將任務進行排序。
• 排程器是執行上下文。 它表示在何時何地執行任務(舉例來說，立即的，或另一種回撥函式機制(比如 setTimeout 或 process.nextTick)，或動畫幀)。
• 排程器有一個(虛擬的)時鐘。 排程器功能通過它的 getter 方法 now() 提供了“時間”的概念。在具體排程器上安排的任務將嚴格遵循該時鐘所表示的時間。