iT邦幫忙

鐵人檔案

第 12 屆 iThome 鐵人賽
回列表
Modern Web

打通 RxJS 任督二脈 系列

RxJS 在前端世界的能見度已經越來越高,不管是 Angular、React、Vue 甚至跳脫這些框架都能夠看到它的身影;由於 RxJS 是多個抽象觀念組合而成,因此顯得更加抽象,不少新手學會 subscribe 及一些 operators (可能還錯誤使用) 之後就因太過抽象而棄坑。
但只要能把相關的基礎打好,透過 RxJS 可以輕易寫出高度好讀、好維護的程式碼,處理複雜問題的時候也能更加得心應手,就此棄坑實在是很可惜的事情!本系列文章將分享我在工作時推坑同事 RxJS 的經驗,以及解釋背後真正所需要的基礎知識,幫助大家掌握這些基本觀念,打通 RxJS 任督二脈!

鐵人鍊成 | 共 35 篇文章 | 171 人訂閱 訂閱系列文 RSS系列文 團隊全端開發人員天梯
DAY 1

達標好文 打通 RxJS 任督二脈

RxJS 是 ReactiveX (又稱 Reactive Extensions,簡稱 Rx) 這個概念的 JavaScript 實現版本;而 Reactive...

2020-09-16 ‧ 由 黃升煌 Mike 分享
DAY 2

開始練習 RxJS 前的環境準備

要開始練習 RxJS,當然要先準備好一個可以開始使用 RxJS 的環境,本篇文章會以完全沒接觸過 RxJS 為假設,介紹幾種起始的環境準備方式,當然對於已經有撰...

2020-09-17 ‧ 由 黃升煌 Mike 分享
DAY 3

三步驟快速上手 RxJS

昨天我們學會了如何開始將專案加入 RxJS,今天讓我們從頭開始,認識一下基本的 RxJS 起手式吧! RxJS 超簡單三步驟 上圖是 ReactiveX 網站...

2020-09-18 ‧ 由 黃升煌 Mike 分享
DAY 4

隨堂測驗 - 使用 RxJS 完成簡易計數器

在昨天的文章最後我們出了一個「簡易計數器」的練習,今天就來看看該如何實作這些功能吧! 實作完成的程式範例:https://stackblitz.com/edit...

2020-09-19 ‧ 由 黃升煌 Mike 分享
DAY 5

達標好文 認識非同步 (Asynchronous) 及串流 (Stream)

非同步 (asynchronous) 與串流 (stream),是程式開發時經常必須面對的議題,各自有各自解決的問題,也各自都有其帶來的延伸問題,今天就先來對這...

2020-09-20 ‧ 由 黃升煌 Mike 分享
DAY 6

觀察者模式 Observable Pattern 認識 RxJS

今天我們來認識 ReactiveX 的重要組成之一,也就是「觀察者模式 - Observer Pattern」。有學過物件導向程式設計的朋友應該都聽過設計模式...

2020-09-21 ‧ 由 黃升煌 Mike 分享
DAY 7

隨堂測驗 - 使用 RxJS 實作影片上架通知功能

昨天的文章中我們實際撰寫 JavaScript 用「觀察者模式」完成了一個「影片上架通知」的功能,今天我們就練習看看直接使用 RxJS 來完成一樣的功能,你會發...

2020-09-22 ‧ 由 黃升煌 Mike 分享
DAY 8

從疊代器模式認識 RxJS

前兩天的文章中我們介紹了「觀察者模式 - Observer Pattern」,今天我們來介紹另外一個在 ReactiveX 中也很重要的觀念:「疊代器模式 -...

2020-09-23 ‧ 由 黃升煌 Mike 分享
DAY 9

達標好文 認識函式語言程式設計 - Functional Programming

函式語言程式設計 (Functional Programming) 是 ReactiveX 應用中非常重要的一部份,在個人過去的經驗中,遇過不少覺得 RxJS...

2020-09-24 ‧ 由 黃升煌 Mike 分享
DAY 10

Functional Programming 常用基本技巧及應用與 RxJS 應用

昨天的文章我們把 functional programming 的大致概念介紹了一下,今天我們來介紹一些使用 functional programming 開發...

2020-09-25 ‧ 由 黃升煌 Mike 分享