文章的內(nèi)容先是介紹函數(shù)式所屬的技能樹位置:編程范式,也介紹了各種范式在前端的體現(xiàn)。隨后會過一批函數(shù)式的常見概念,給對函數(shù)式思想了解較少的同學一些基礎內(nèi)容。這兩章節(jié)我理解對于基礎較好的同學可能是老生常談,但因為加入了一些前端示例和我的理解,也應該能算是老壇新酒。
了解完編程范式和基礎概念后,我會直接進入“函數(shù)式思維”的內(nèi)容。這章內(nèi)容主要是幫助大家在依賴函數(shù)式框架工具設計時,從傳統(tǒng)命令式編程的思考方式,向更契合函數(shù)式前端開發(fā)的方式改變。比如對循環(huán)的實現(xiàn)、數(shù)據(jù)結構的差別、對異常態(tài)和類型的處理等。
第四到七章,分別是前端函數(shù)式的幾種重要的形態(tài)。第四章是Monadic編程,它是函數(shù)式的一種經(jīng)典工程實現(xiàn),也在前端衍生了一些工具。我將在這章把前端函數(shù)式的幾個基礎理論單元如函子、幺半群的介紹,用它們實現(xiàn)復雜工具Promise的推導,以及少量有必要介紹給大家的范疇論知識都詳盡敘述。
第五章則是“從jQuery而來,看函數(shù)式工具形態(tài)演進”。很多其他領域工程師對前端的理解都停留在了jQuery的經(jīng)典時代。我會從函數(shù)式的“形”的角度出發(fā),帶來jQuery開始的前端函數(shù)式工具論述。第六章和第七章我將介紹前端函數(shù)式發(fā)展到一定成熟度后,這兩年的兩個熱門框架工具:RxJS和React Hook。介紹他們的基本原理和他們基于什么樣的需求和過程演進出來的。
所以文章基本是兩大部分,前三章的偏理論內(nèi)容,和后四章的偏熱門工具內(nèi)容。也都是大家希望付出一定時間了解的熱點內(nèi)容。
*后一章,我想在總結的同時,回歸初心,和大家探討一些當前前端開發(fā)的核心復雜度,以及函數(shù)式在當前前端開發(fā)中的貢獻。然后我們還要厘定方向,像多借鑒函數(shù)式思想一樣,多借“他山之石”,幫助大家在前端和其他研發(fā)領域成為更出色的研發(fā)工程師。
前 言
第1章 編程范式和前端體現(xiàn) 1
1.1 編程范式 2
1.2 命令式編程 2
1.3 面向?qū)ο? 3
1.4 元編程 4
1.5 聲明式編程 5
1.6 邏輯式編程 6
1.7 函數(shù)式編程 8
1.8 案例和代碼 9
1.8.1 案例總覽 9
1.8.2 命令式編程示例 11
1.8.3 聲明式編程示例 11
1.8.4 面向?qū)ο、元編程和函?shù)式編程示例 13
1.9 本章小結 15
第2章 前端函數(shù)式基礎概念 16
2.1 JavaScript多范式中的函數(shù)式 16
2.1.1 閉包 17
2.1.2 高階函數(shù) 18
2.1.3 Lambda表達式 19
2.1.4 Array數(shù)組集合和函數(shù)組合子 20
2.2 持續(xù)補全 21
2.2.1 基于JavaScript高階函數(shù)的編碼優(yōu)化 21
2.2.2 基于工具和標準的再加工 24
2.3 函數(shù)式的抽象單元 26
2.3.1 副作用 27
2.3.2 引用透明和純函數(shù) 27
2.4 案例和代碼 28
2.4.1 閉包和單例 28
2.4.2 數(shù)組方法和鏈式調(diào)用 31
2.4.3 惰性加載 32
2.5 本章小結 33
第3章 函數(shù)式思維和前端特征 35
3.1 狀態(tài)和副作用 36
3.2 過程和高階抽象 38
3.2.1 便捷地對過程反復包裝 39
3.2.2 另一種編程世界觀:流過系統(tǒng)的信息流 40
3.3 運行環(huán)境承擔更多的職責 41
3.3.1 循環(huán)、映射和遞歸 42
3.3.2 函數(shù)式過程抽象忽略的細節(jié)操作 43
3.4 類型和數(shù)據(jù)結構 44
3.4.1 面向能力的數(shù)據(jù)結構 44
3.4.2 對場景下類型的作用進行替換 46
3.5 設計模式和語言特征 48
3.6 異常態(tài) 49
3.7 前端的其他特征 50
3.7.1 弱類型和動態(tài)類型 51
3.7.2 Array的組合運算 51
3.8 案例和代碼 52
3.8.1 狀態(tài)和副作用示例 52
3.8.2 過程和高階抽象示例 55
3.8.3 循環(huán)和遞歸示例 56
3.8.4 類型檢測和動態(tài)類型 60
3.8.5 異常態(tài)和容錯處理 61
3.9 本章小結 63
第4章 Monadic編程和它的范疇理論 64
4.1 Monadic編程簡介 64
4.2 函子和它的基礎實例 65
4.3 應用函子 66
4.4 Maybe實現(xiàn)類 68
4.5 Either函子 71
4.6 幺半群 73
4.7 單子:自函子范疇上的幺半群 75
4.8 函數(shù)響應式編程 77
4.9 案例和代碼 78
4.9.1 函子示例 78
4.9.2 響應式編程的簡單示例 80
4.10 本章小結 81
第5章 函數(shù)式工具形態(tài)演進 82
5.1 jQuery和鏈式調(diào)用 82
5.2 管道和組合 84
5.3 Promise編碼 87
5.4 Async/Await函數(shù) 89
5.5 MobX、RxJS和響應式編程 90
5.6 函數(shù)式的并發(fā)保障 92
5.7 案例和代碼 94
5.7.1 鏈式調(diào)用和開發(fā)中調(diào)試 94
5.7.2 Pipeline和切面編程 95
5.7.3 Async/Await異步和異常 96
5.8 本章小結 97
第6章 從RxJS看事件流和函數(shù)響應式編程 99
6.1 RxJS的產(chǎn)生和事件流編程演進 99
6.1.1 RxJS的產(chǎn)生 100
6.1.2 事件流響應演變 100
6.2 核心類 103
6.3 “紅包雨掉落”代碼改造 106
6.4 事件流相關主要方法舉例 110
6.5 案例和代碼 114
6.6 本章小結 118
第7章 React Hooks和它的函數(shù)式考量 120
7.1 無狀態(tài)組件和狀態(tài)管理 120
7.1.1 現(xiàn)代前端框架和無狀態(tài)組件 121
7.1.2 狀態(tài)管理 125
7.2 React Hooks的原理和目的 128
7.3 React Hooks的實踐和方向 130
7.4 案例和代碼 133
7.5 本章小結 137
第8章 函數(shù)式和前端復雜度總結 138
8.1 前端開發(fā)的復雜度 138
8.1.1 前端開發(fā)者可以介入的時機 139
8.1.2 純粹的運算復雜度 142
8.1.3 前端和相鄰領域復雜度的區(qū)別 142
8.2 函數(shù)式在前端的積極作用 144
8.2.1 厘清運行時的狀態(tài)變化 145
8.2.2 加強編程的工程指標 145
8.2.3 簡化編碼 146
8.3 編碼之上的工作 146
8.3.1 軟件完整度和現(xiàn)實的工作狀態(tài) 146
8.3.2 前端迭代的呼應 147
8.3.3 編碼外的更多規(guī)劃 148
8.4 他山之石 148
8.4.1 前端即是客戶端 148
8.4.2 更充分地利用前端能力 149
8.4.3 工程研發(fā) 149
8.5 案例和代碼 151
8.5.1 前端開發(fā)復雜度 151
8.5.2 運行時監(jiān)控和整體工程特性 155
8.6 本章小結 158
第9章 簡易關卡引擎項目補充 159
9.1 需求清單 159
9.2 項目和文件結構 161
9.3 開發(fā)者和用戶交互 162
9.4 整體服務和引擎生命周期 162
9.5 代碼清單 163
9.5.1 主頁需求實現(xiàn) 163
9.5.2 關卡頁需求實現(xiàn) 167
9.5.3 統(tǒng)計分數(shù)等數(shù)據(jù)服務邏輯 176
9.5.4 體力模式等前端業(yè)務邏輯 178
9.5.5 自定義關卡詳情頁 181
9.5.6 廣告頁和活動頁 183
9.6 更多擴展 186
9.7 本章小結 186