• 打電話給銀行客服，等待著轉接時間，卻常常等到～
  所有的客服人員都在忙線中，請稍後再撥，謝謝!

• 也就是說，有客服人員閒置，才會接上線，沒有的話，抱歉請稍後再撥!

• 今天我們要介紹的，就是像這樣的客服系統~ exhaustAll及exhaustMap。

exhaust

圖片來源-RxJS-exhaustAll

• 從上方的彈珠圖來看，第一次click觸發，並接收到一個observable，特別的是~
  中間任何的事件再怎麼處發，都會被直接丟棄

case1:

stackblitz

import { fromEvent, map, exhaustAll, interval, take, tap } from 'rxjs';

// case1:=== exhaustAll ===
console.log('=== case1: exhaustAll ===');
const timer$ = interval(1000).pipe(take(3));
fromEvent(document, 'click')
  .pipe(
    tap(() => console.log('click!')),
    map(() => timer$),
    exhaustAll()
  )
  .subscribe(console.log);

• 注意到了吧! exhaustAll就像一對一的接待一樣，只專注眼前的訂閱服務，而不理會過程中任何的干擾，這樣的特性，相當適合運用在使用者登入頁面的設計：

當使用者點選，送出帳號密碼的請求，過程中，我們暫時將Login按鈕disabled，直到系統回覆，才會進行下一個動作。

case2: 更帥～是一定要的

• 前幾個章節都有提到，我們照樣學習怎麼帥一波

exhaustMap = map+exhaustAll
stackblitz

import {
  fromEvent,
  map,
  exhaustMap,
  exhaustAll,
  interval,
  take,
  tap,
} from 'rxjs';

// case2:=== exhaustMap ===
console.log('=== case2: exhaustMap ===');
const timer$ = interval(1000).pipe(take(3));
fromEvent(document, 'click')
  .pipe(
    tap(() => console.log('click!')),
    // map(() => timer$),
    // exhaustAll()
    exhaustMap(() => timer$) //<-- exhaustMap 帥一波
  )
  .subscribe(console.log);

✍Recap

1. exhaustAll: 專注處理當前的observable，直到結束，才會接收新的observable。
2. exhaustMap: 等同於map+exhaustAll。

總整理

• 今天來到了第29天，剩下最後一天啦~~~!!能熬到現在，我自己都覺得超帥，好好的沉澱一下，明天仍是一場不簡單的硬仗，衝阿!