Rxjs Observable.pipe 传入多个 operators 的执行逻辑分析
測(cè)試代碼：
fromEvent(this.test, 'click').pipe(map( event => event.timeStamp), mapTo(1)).subscribe((event) => console.log(event));pipe 操作的兩個(gè)輸入操作：
輸入?yún)?shù)為數(shù)組，包含兩個(gè)元素：
使用原始的 Observable 作為輸入，執(zhí)行這兩個(gè)操作：
數(shù)組的 reduce 是一個(gè)原生方法：
下面這段代碼，介紹了 reduce 的用法：
<html> <script>var a = [1,2,3,4];function fn(pre, cur, index, arr){console.log(`previous: ${pre}, cur: ${cur},index: ${index}, whole arr: ${arr}`);return pre + cur; }console.log(a.reduce( fn, 0));</script> </html>reduce 接受兩個(gè)參數(shù)，第一個(gè)參數(shù)是一個(gè)函數(shù)，該函數(shù)接收 4 個(gè)輸入?yún)?shù)，previous，current，index 和 array：
- previous：前一輪 reduce 迭代值，如果第一輪，則該值為第二個(gè)參數(shù)，即初始值
- current：當(dāng)前這輪的 reduce 迭代值。例如，array 元素為1，2，3，4，則 reduce 每輪迭代，current 值分別為1，2，3，4
- index：迭代的索引值
- array：調(diào)用 reduce 的原始數(shù)組，配合前一個(gè) index 參數(shù)，能訪問(wèn)整個(gè)數(shù)組的內(nèi)容
在實(shí)際使用過(guò)程中，previous 和 current 這兩個(gè)參數(shù)用的最多。
回到 pipeFromArray 的實(shí)現(xiàn)。
reduce 第一輪迭代：
prev 是 input 傳入的初始值，fn 是輸入 fns 數(shù)組的第一個(gè)元素。即第一個(gè) map 返回的 operator：
這里不會(huì)執(zhí)行具體的 map 操作，而是返回一個(gè)新的 Observable 對(duì)象，作為第二輪 reduce 迭代的輸入：
lift 方法就是返回新的 Observable 對(duì)象：
mapTo 的實(shí)現(xiàn)：
經(jīng)過(guò) pipe 處理過(guò)的 Observable，最后應(yīng)用程序訂閱的，就是這個(gè)最終版的 Observable：
更多Jerry的原創(chuàng)文章，盡在：“汪子熙”:
總結(jié)
以上是生活随笔為你收集整理的Rxjs Observable.pipe 传入多个 operators 的执行逻辑分析的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： 上海主要地标经纬度「建议收藏」(上海市人
- 下一篇： Rxjs 里 subscribeToAr