Javascript柯里化實現(xiàn)原理及作用解析
函數(shù)式編程是一種如今比較流行的編程范式,它主張將函數(shù)作為參數(shù)進(jìn)行傳遞,然后返回一個沒有副作用的函數(shù),說白了,就是希望一個函數(shù)只做一件事情。
像JavaScript,Haskell,Clojure等編程語言都支持函數(shù)式編程。
這種編程思想涵蓋了三個重要的概念:
- 純函數(shù)
- 柯里化
- 高階函數(shù)
而這篇文章主要是想向大家講清楚柯里化這個概念。
什么是柯里化
首先我們先來看一個例子:
function sum(a, b, c) {
return a + b + c;
}
// 調(diào)用
sum(1, 2, 3); // 6
上述函數(shù)實現(xiàn)的是將a,b,c三個參數(shù)相加,改寫為柯里化函數(shù)如下:
function sum(a) {
return function (b) {
return function(c) {
return a + b + c;
}
}
}
// 調(diào)用
let sum1 = sum(1);
let sum2 = sum1(2);
sum2(3); // 6
所謂柯里化就是把具有較多參數(shù)的函數(shù)轉(zhuǎn)換成具有較少參數(shù)的函數(shù)的過程。
我們來一步步看上面那個柯里化函數(shù)做了什么,首先第一步調(diào)用了sum(1),此時變量sum1相當(dāng)于:
sum1 = function(b) {
return function(c) {
// 注意此時變量a存在于閉包中,可以調(diào)用,a = 1
return a + b + c;
}
}
然后調(diào)用sum1(2),此時賦值給變量sum2相當(dāng)于:
sum2 = function(c) {
// 變量a,b皆在閉包中, a = 1, b = 2
return a + b + c;
}
最后調(diào)用sum2(3),返回1 + 2 + 3的結(jié)果6;
這就是一個最簡單的柯里化函數(shù),是不是很簡單呢?
柯里化函數(shù)的作用
那么問題來了,上面改寫后的柯里化函數(shù)和原函數(shù)比起來代碼多了不少,而且也不如原函數(shù)好理解,柯里化函數(shù)到底有什么用呢?
確實,柯里化函數(shù)在這里看起來的確是很臃腫,不實用,但在很多場景下他的作用是很大的,甚至很多人在不經(jīng)意間已經(jīng)在使用柯里化函數(shù)了。舉一個簡單的例子:
假設(shè)我們有一批的長方體,我們需要計算這些長方體的體積,實現(xiàn)一個如下函數(shù):
function volume(length, width, height) { return length * width * height; } volume(200, 100, 200); volume(200, 150, 100); volume(200, 50, 80); volume(100, 50, 60);
如上計算長方體的體積函數(shù)會發(fā)現(xiàn)存在很多相同長度的長方體,我們再用柯里化函數(shù)實現(xiàn)一下:
function volume(length, width, height) { return function(width) { return function(height) { return length * width * height; } } } let len200 = volume(200); len200(100)(200); len200(150)(100); len200(50)(80); volume(100)(50)(60);
如上,通過實現(xiàn)一個len200函數(shù)我們統(tǒng)一處理長度為200的長方體的體積,這就實現(xiàn)了參數(shù)復(fù)用。
我們再舉一個只執(zhí)行一次函數(shù)的例子:
function execOnce(fun) { let flag = true; return function() { if (flag) { fun && fun(); flag = false; } } } let onceConsole = execOnce(function() { console.log('只打印一次'); }); onceConsole(); onceConsole();
如上,我們實現(xiàn)了一個execOnce函數(shù),該函數(shù)接受一個函數(shù)參數(shù),然后返回一個函數(shù),變量flag存在閉包中,用來判斷返回的函數(shù)是否執(zhí)行過,onceConsole相當(dāng)于:
let onceConsole = function() { if (flag) { (function() { console.log('只打印一次'); })() flag = false; } }
這也是柯里化函數(shù)的一個簡單應(yīng)用。
通用柯里化函數(shù)的實現(xiàn)
既然柯里化函數(shù)這么實用,那么我們能不能實現(xiàn)一個通用的柯里化函數(shù)呢?所謂通用,就是說該函數(shù)可以把函數(shù)參數(shù)轉(zhuǎn)換為柯里化函數(shù),看下第一版實現(xiàn)的代碼:
// 第一版 var curry = function (fn) { var args = [].slice.call(arguments, 1); return function() { var newArgs = args.concat([].slice.call(arguments)); return fn.apply(null, newArgs); }; }; function add(a, b) { return a + b; } var addFun = curry(add, 1, 2); addFun() // 3 //或者 var addOne = curry(add, 1);
如上代碼,我們接受一個函數(shù)作為參數(shù),然后收集其它的參數(shù),將這些參數(shù)傳給這個函數(shù)參數(shù)去執(zhí)行。但上面的代碼有個問題,參數(shù)不夠自由,比如我們想這么調(diào)用就會報錯:
var addFun = curry(function(a, b,c) {
return a + b + c;
}, 1);
addFun(2)(3); // 報錯 addFun(...) is not a function
這好像違背了我們參數(shù)復(fù)用的原則,改進(jìn)如下:
function curry(fn, args) { var length = fn.length; args = args || []; return function(...rest) { var _args = [...args, ...rest]; return _args.length < length ? curry.call(this, fn, _args) : fn.apply(this, _args); } } var fn = curry(function(a, b, c) { console.log(a + b + c); }); fn('a', 'b', 'c'); // abc fn('a', 'b')('c'); // abc fn('a')('b')('c'); // abc
如上實現(xiàn)就很完善,該工具函數(shù)的實現(xiàn)總結(jié)起來就一句話:
利用閉包將函數(shù)的參數(shù)儲存起來,等參數(shù)達(dá)到一定數(shù)量時執(zhí)行函數(shù)。
后記
柯里化是以閉包為基礎(chǔ)的,不理解閉包可能對柯里化的理解有所阻礙,希望通過這篇文章能讓各位了解和理解JavaScript的柯里化。
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- JavaScript函數(shù)柯里化實現(xiàn)原理及過程
- 淺析JavaScript 函數(shù)柯里化
- js函數(shù)柯里化的方法和作用實例分析
- 通過實例了解Javascript柯里化流程
- javascript實現(xiàn)函數(shù)柯里化與反柯里化過程解析
- JavaScript偏函數(shù)與柯里化實例詳解
- JS中精巧的自動柯里化實現(xiàn)方法
- 淺談JS中的反柯里化( uncurrying)
- 詳解JS中的柯里化(currying)
- JavaScript函數(shù)柯里化原理與用法分析
- 淺談JS中的bind方法與函數(shù)柯里化
- Javascript閉包與函數(shù)柯里化淺析
- 深入剖析JavaScript中的函數(shù)currying柯里化
- javascript中利用柯里化函數(shù)實現(xiàn)bind方法【推薦】
- JavaScript函數(shù)柯里化詳解
- javascript中利用柯里化函數(shù)實現(xiàn)bind方法
- 深入解析JavaScript中函數(shù)的Currying柯里化
- 怎樣用Javascript實現(xiàn)函數(shù)柯里化與反柯里化
相關(guān)文章
JavaScript如何將后端獲取到的byte數(shù)組轉(zhuǎn)為文件
這篇文章主要給大家介紹了關(guān)于JavaScript如何將后端獲取到的byte數(shù)組轉(zhuǎn)為文件的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考借鑒價值,需要的朋友可以參考下2024-04-04深入淺析JavaScript中數(shù)據(jù)共享和數(shù)據(jù)傳遞
這篇文章主要介紹了深入淺析JavaScript中數(shù)據(jù)共享和數(shù)據(jù)傳遞的相關(guān)資料,需要的朋友可以參考下2016-04-04