JavaScript函數(shù)柯里化實現(xiàn)原理及過程
簡介
當我們在讀Vue源碼到時候會發(fā)現(xiàn),在它的 _update 實例中就用到了函數(shù)柯里化,(createPatchFunction方法)有興趣的可以
去看一下。
柯里化(Currying)是把接受多個參數(shù)的函數(shù)變換成接受一個單一參數(shù)(最初函數(shù)的第一個參數(shù))的函數(shù),并且返回接受余下的參數(shù)而且返回結果的新函數(shù)的技術。
在《Mostly adequate guide》中,這樣總結了 Currying ——只傳遞給函數(shù)一部分參數(shù)來調用它,讓它返回一個函數(shù)去處理剩下的參數(shù)。
Currying 是函數(shù)式編程的一種實現(xiàn),可以給我們的編程帶來便利。那 Currying 函數(shù)到底長什么樣呢?請往下看,我們根據(jù)它的概念自己來寫一個柯里化函數(shù)
實現(xiàn)
// 如何實現(xiàn) add(1,2) === add(1)(2) let add = (...args) => { return args.length === 1 ? a => a + args[0] : args[0] + args[1] }
這個似乎有一點接近柯里化的意思,但并不是真正的Currying,我們應該做到 add(1,2,3,,,) === currying(add)(1,2,3,,,) 才能算是真正的柯里化函數(shù),OK,我們繼續(xù)往下來,
let add = (...args) => args.reduce((a,b)=>a+b) let currying = (fn)=>{ return function(...args){ return fn.apply(this, args) } } // add(1,2,3,,,) === currying(add)(1,2,3,,,)
還有人這么玩,可以參考下
let currying = (fn) => { var args = [].slice.call(arguments, 1) return function() { var newArgs = args.concat([].slice.call(arguments)) return fn.apply(this, newArgs) } } let addCurry = currying(add, 1, 2); addCurry() // 3 addCurry = currying(add, 1); addCurry(2) // 3 addCurry = currying(add); addCurry(1, 2) // 3
實際上這個實現(xiàn)方法利用閉包的原理,有時間給大家做個對比,
分析
可以看到,實際上柯里化函數(shù)并不算難,要想實際運用在我們的開發(fā)中,需要我們花點小心思~
參考:https://github.com/FIGHTING-TOP/FE-knowlodge-base/issues/4
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
相關文章
輸入自動提示搜索提示功能的使用說明:sugggestion.txt
該js文件中的代碼實現(xiàn)了[輸入自動搜索提示]功能,如百度、google搜索框中輸入一些字符會以下拉列表形式給出一些提示,提高了用戶體驗2013-09-09JavaScript拆分字符串時產(chǎn)生空字符的解決方案
使用JavaScript的split方法拆分字符串時出現(xiàn)一些空字符串"",尤其是當使用正則表達式作為分隔符的時候。那么,產(chǎn)生這些空字符串的原因是什么?又該如何來處理呢,這就是今天我們要探討的問題2014-09-09JavaScript?Generator異步過度的實現(xiàn)詳解
生成器Generator是JavaScript?ES6引入的特性,它讓我們可以分段執(zhí)行一個函數(shù)。但是在談論生成器(Generator)之前,我們要先了解迭代器Iterator2022-08-08如何實現(xiàn)JavaScript動態(tài)加載CSS和JS文件
這篇文章主要為大家詳細介紹了JavaScript動態(tài)加載CSS和JS文件,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2015-10-10