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