希望是最淺顯易懂的 RxJS 教學
前言 關注 RxJS 已經好一段時間了，最早知道這個東西是因為 redux-observable，是一個 redux 的 middleware，Netflix 利用它來解決複雜的非同步相關問題，那時候我連redux-saga都還沒搞懂，沒想到就又有新的東西出來了。 半年前花了一些時間，找了很多網路上的資料，試圖想要搞懂這整個東西。可是對我來說，很多教學的步調都太快了，不然就是講得太仔細，反而讓初學者無所適從。 這次有機會在公司的新專案裡面嘗試導入redux-observable，身為提倡要導入的人，勢必要對這東西有一定的瞭解。秉持著這個想法，上週認真花了點時間再次把相關資源都研究了一下，漸漸整理出一套「我覺得應該可以把 RxJS 講得更好懂」的方法，在這邊跟大家分享一下。 在開始之前，要先大力稱讚去年 iT 邦幫忙鐵人賽的 Web 組冠軍：30 天精通 RxJS，這系列文章寫得很完整，感受得出來作者下了很多功夫在這上面。看完這篇之後如果對更多應用有興趣的，可以去把這系列的文章讀完。 好，那就讓我們開始吧！ 請你先忘掉 RxJS 沒錯，你沒看錯。 要學會 RxJS 的第一件事情就是：忘記它。 忘記有這個東西，完全忘記，先讓我講幾個其他東西，等我們需要講到 RxJS 的時候我會再提醒你的。 在我們談到主角之前，先來做一些有趣的事情吧！ 程式基礎能力測試 先讓我們做一個簡單的練習題暖身，題目是這樣的： 有一個陣列，裡面有三種類型的資料：數字、a~z組成的字串、數字組成的字串，請你把每個數字以及數字組成的字串乘以二之後加總 範例輸入：[1, 5, 9, 3, ‘hi’, ‘tb’, 456, ’11’, ‘yoyoyo’] 你看完之後應該會說：「這有什麼難的？」，並且在一分鐘以內就寫出下面的程式碼： const source = [1, 5, 9, 3, ‘hi’, ‘tb’, 456, ’11’, ‘yoyoyo’]; […]