經曆過一些列的函數式程式設計思想的學習總結,一些重要的高階函數的學習,以及前一段時間關于 RxJS 的學習。
我們再回看一次 —— 組合函數 compose
本瓜越來越覺得,【易讀】的代碼應該是将聲明和調用分開來的。根據不同的流程,用函數組合的方式、也可以說它是管道、或者說是鍊式調用,将聲明的函數組合起來,再等待時機進行調用。
如果沒有組合函數 compose,函數調用将會是嵌套的:
const multi10 = function(x) { return x * 10; }
const toStr = function(x) { return `${x}`; }
const compute = function(x){
return toStr(multi10(x))
}
compute(8)
複制代碼
fn3(fn2(fn1(fn0(x))))
,層層嵌套是很容易看錯的;
是以,必須嘗試将調用層級扁平化!
compose 應運而生,它大概就會是這樣:
const compose = function(f,g) {
return function(x) {
return f(g(x))
}
}
複制代碼
let compute = compose(toStr, multi10)
compute(8)
複制代碼
通過使用
compose
函數我們可以把兩個函數組合成一個函數,這讓代碼從右往左執行,而不是層層計算某個函數的結果作為另一個函數的參數,這樣代碼也更加直覺。
當然,我們不能讓 compose 限制于隻能處理連續調用兩個函數,于是支援任意參數版本的 compose 将是這樣的:
function compose(...funs){
return (x) =>funs.reduce((acc, fun) => fun(acc), x)
}
複制代碼
通過函數組合,我們可以可以聲明式地指定函數間的關系,代碼的可讀性也大大提高,也友善我們後續對代碼進行擴充跟重構;
而且在
React
裡面,當我們的高階元件變多的時候,一個套着一個就很難看,我們就可以通過類似的方式來讓我們的高階元件層級扁平化;
這就是最最原始的 compose,以及它被提出的原始動機~~