使用 React 作為前端架構的朋友對於 Flux 應該都不陌生，React 也內建了 Flux 讓我們可以直接使用，同時也有許多其他的 library 以這個架構為基礎設計，並應用在各種前端框架下，如 Redux (for React)、NgRx (for Angular) 和 Vuex (for Vue) 等等。可以見得它是多麽重要的東西，今天我們來嘗試實際使用 RxJS 來實作一下這種架構，也藉此多認識一下 Flux Pattern 的重要觀念。

今天我們用實際的例子來練習各種 RxJS operators 的組合運用！在一般的應用程式裡面，資料查詢應該算是非常常見的情境了，我們就實際使用資料查詢的功能做範例，加上各種變化，來練習一些 operators 的實際使用吧！

還記得之前我們介紹過 Cold Observable v.s. Hot Observable 嗎？

Cold Observable 和觀察者 (Observer) 是一對一的關係，也就是每次產生訂閱時，都會是一個全新的資料流。而 Hot Observable 和觀察者則是一對多的關係，也就是每次產生訂閱時，都會使用「同一份資料流」，而今天要介紹的 operators 目的就是將 Cold Observable 轉成 Hot Observable，讓原來的資料流可以共用。

今天的觀念會比較複雜一點，打起精神繼續看下去吧！

在撰寫前端程式時，我們很難避免會遇到非同步的程式處理，在大量使用 RxJS 的 Angular 中更是如此，而今天我們要介紹的 AsyncPipe 在樣板上要處理非同步可以說是非常方便的工具！