亚洲免费乱码视频,日韩 欧美 国产 动漫 一区,97在线观看免费视频播国产,中文字幕亚洲图片

      1. <legend id="ppnor"></legend>

      2. 
        
        <sup id="ppnor"><input id="ppnor"></input></sup>
        <s id="ppnor"></s>

        深入解析JavaScript中函數(shù)的Currying柯里化

        字號:


            這篇文章主要介紹了JavaScript中函數(shù)的Currying柯里化,Currying 的重要意義在于可以把函數(shù)完全變成"接受一個參數(shù)、返回一個值"的固定形式,需要的朋友可以參考下
            引子
            先來看一道小問題:
            有人在群里出了到一道題目:
            var s = sum(1)(2)(3) ....... 最后 alert(s) 出來是6  
            var s = sum(1)(2)(3)(4) ....... 最后 alert(s) 出來是10  
            問sum怎么實現(xiàn)?
            剛看到題目,我第一反應(yīng)是sum返回的是一個function,但是沒有最終實現(xiàn),印象中看到過類似的原理,但是記不清了。
            后來同事說,這個是叫柯里化,
            實現(xiàn)方法比較巧妙:
            function sum(x){ 
             var y = function(x){ 
              return sum(x+y) 
             } 
             y.toString = y.valueOf = function(){ 
              return x; 
             } 
             return y; 
            } 
            下面我們就深入來看一下currying柯里化~
            什么是柯里化?
            柯里化是這樣的一個轉(zhuǎn)換過程,把接受多個參數(shù)的函數(shù)變換成接受一個單一參數(shù)(注:最初函數(shù)的第一個參數(shù))的函數(shù),如果其他的參數(shù)是必要的,返回接受余下的參數(shù)且返回結(jié)果的新函數(shù)。
            當(dāng)我們這么說的時候,我想柯里化聽起來相當(dāng)簡單。JavaScript中是怎么實現(xiàn)的呢?
            假設(shè)我們要寫一個函數(shù),接受3個參數(shù)。
            var sendMsg = function (from, to, msg) {
             alert(["Hello " + to + ",", msg, "Sincerely,", "- " + from].join("\n"));
            };
            現(xiàn)在,假定我們有柯里化函數(shù),能夠把傳統(tǒng)的JavaScript函數(shù)轉(zhuǎn)換成柯里化后的函數(shù):
            var sendMsgCurried = curry(sendMsg); 
            // returns function(a,b,c)
            var sendMsgFromJohnToBob = sendMsgCurried("John")("Bob"); 
            // returns function(c)
            sendMsgFromJohnToBob("Come join the curry party!"); 
            //=> "Hello Bob, Come join the curry party! Sincerely, - John"
            手動柯里化
            在上面的例子中,我們假定擁有神秘的curry函數(shù)。我會實現(xiàn)這樣的函數(shù),但是現(xiàn)在,我們首先看看為什么這樣的函數(shù)是如此必要。
            舉個例子,手動柯里化一個函數(shù)并不困難,但是確實有點啰嗦:
            // uncurried
            var example1 = function (a, b, c) {
            // do something with a, b, and c
            };
            // curried
            var example2 = function(a) {
             return function (b) {
              return function (c) {
            // do something with a, b, and c
              };
             };
            };
            在JavaScript,即使你不指定一個函數(shù)所有的參數(shù),函數(shù)仍將被調(diào)用。這是個非常實用JavaScript的功能,但是卻給柯里化制造了麻煩。
            思路是每一個函數(shù)都是有且只有一個參數(shù)的函數(shù)。如果你想擁有多個參數(shù),你必須定義一系列相互嵌套的函數(shù)。討厭!這樣做一次兩次還可以,可是需要以這種方式定義需要很多參數(shù)的函數(shù)的時候,就會變得相當(dāng)啰嗦和難于閱讀。(但是別擔(dān)心,我會馬上告訴你一個辦法)
            一些函數(shù)編程語言,像Haskell和OCaml,語法中內(nèi)置了函數(shù)柯里化。在這些語言中,舉個例子,每個函數(shù)是擁有一個參數(shù)的函數(shù),并且只有一個參數(shù)。你可能會認(rèn)為這種限制麻煩勝過好處,但是語言的語法就是這樣,這種限制幾乎無法察覺。
            舉個例子,在OCaml,你可以用兩種方式定義上面example:
            let example1 = fun a b c ->
            // (* do something with a, b, c *)
            let example2 = fun a ->
             fun b ->
              fun c ->
            // (* do something with a, b, c *)
            很容易看出這兩個例子和上面的那兩個例子是如何的相似。
            區(qū)別,然而,是否在OCaml也是做了同樣的事情。OCaml,沒有擁有多個參數(shù)的函數(shù)。但是,在一行中聲明多個參數(shù)就是嵌套定義單參函數(shù)“快捷方式”。
            類似的 ,我們期待調(diào)用柯里化函數(shù)句法上和OCaml中調(diào)用多參函數(shù)類似。我們期望這樣調(diào)用上面的函數(shù):
            example1 foo bar baz
            example2 foo bar baz
            而在JavaScript,我們采用明顯不同的方式:
            example1(foo, bar, baz);
            example2(foo)(bar)(baz);
            在OCaml這類語言中,柯里化是內(nèi)置的。在JavaScript,柯里化雖然可行(高階函數(shù)),但是語法上是不方便的。這也是為什么我們決定編寫一個柯里化函數(shù)來幫我們做這些繁瑣的事情,并使得我們的代碼簡潔。
            創(chuàng)建一個curry輔助函數(shù)
            理論上我們期望可以有一個方便的方式轉(zhuǎn)換普通老式的JavaScript函數(shù)(多個參數(shù))到完全柯里化的函數(shù)。
            這個想法不是我獨有的,其他的人已經(jīng)實現(xiàn)過了,例如在wu.js 庫中的.autoCurry()函數(shù)(盡管你關(guān)心的是我們自己的實現(xiàn)方式)。
            首先,讓我們創(chuàng)建一個簡單的輔助函數(shù) .sub_curry:
            function sub_curry(fn 
            /*, variable number of args */
            ) {
             var args = [].slice.call(arguments, 1);
             return function () {
              return fn.apply(this, args.concat(toArray(arguments)));
             };
            }
            讓我們花點時間看看這個函數(shù)的功能。相當(dāng)簡單。sub_curry接受一個函數(shù)fn作為它的第一個參數(shù),后面跟著任何數(shù)目的輸入?yún)?shù)。返回的是一個函數(shù),這個函數(shù)返回fn.apply執(zhí)行結(jié)果,參數(shù)序列合并了該函數(shù)最初傳入?yún)?shù)的,加上fn調(diào)用的時候傳入?yún)?shù)的。
            看例子:
            var fn = function(a, b, c) { return [a, b, c]; };
            // these are all equivalent
            fn("a", "b", "c");
            sub_curry(fn, "a")("b", "c");
            sub_curry(fn, "a", "b")("c");
            sub_curry(fn, "a", "b", "c")();
            //=> ["a", "b", "c"]
            很明顯,這并不是我門想要的,但是看起來有點柯里化的意思了?,F(xiàn)在我們將定義柯里化函數(shù)curry:
            function curry(fn, length) {
            // capture fn's # of parameters
             length = length || fn.length;
             return function () {
              if (arguments.length < length) {
            // not all arguments have been specified. Curry once more.
               var combined = [fn].concat(toArray(arguments));
               return length - arguments.length > 0 
                ? curry(sub_curry.apply(this, combined), length - arguments.length)
                : sub_curry.call(this, combined );
              } else {
            // all arguments have been specified, actually call function
               return fn.apply(this, arguments);
              }
             };
            }
            這個函數(shù)接受兩個參數(shù),一個函數(shù)和要“柯里化”的參數(shù)數(shù)目。第二個參數(shù)是可選的,如果省略,默認(rèn)使用Function.prototype.length 屬性,就是為了告訴你這個函數(shù)定義了幾個參數(shù)。
            最終,我們能夠論證下面的行為:
            var fn = curry(function(a, b, c) { return [a, b, c]; });
            // these are all equivalent
            fn("a", "b", "c");
            fn("a", "b", "c");
            fn("a", "b")("c");
            fn("a")("b", "c");
            fn("a")("b")("c");
            //=> ["a", "b", "c"]
            我知道你在想什么…
            等等…什么?!
            難道你瘋了?應(yīng)該是這樣!我們現(xiàn)在能夠在JavaScript中編寫柯里化函數(shù),表現(xiàn)就如同OCaml或者Haskell中的那些函數(shù)。甚至,如果我想要一次傳遞多個參數(shù),我可以向我從前做的那樣,用逗號分隔下參數(shù)就可以了。不需要參數(shù)間那些丑陋的括號,即使是它是柯里化后的。
            這個相當(dāng)有用,我會立即馬上談?wù)撨@個,可是首先我要讓這個Curry函數(shù)前進一小步。
            柯里化和“洞”(“holes”)
            盡管柯里化函數(shù)已經(jīng)很牛了,但是它也讓你必須花費點小心思在你所定義函數(shù)的參數(shù)順序上。終究,柯里化的背后思路就是創(chuàng)建函數(shù),更具體的功能,分離其他更多的通用功能,通過分步應(yīng)用它們。
            當(dāng)然這個只能工作在當(dāng)最左參數(shù)就是你想要分步應(yīng)用的參數(shù)!
            為了解決這個,在一些函數(shù)式編程語言中,會定義一個特殊的“占位變量”。通常會指定下劃線來干這事,如過作為一個函數(shù)的參數(shù)被傳入,就表明這個是可以“跳過的”。是尚待指定的。
            這是非常有用的,當(dāng)你想要分步應(yīng)用(partially apply)一個特定函數(shù),但是你想要分布應(yīng)用(partially apply)的參數(shù)并不是最左參數(shù)。
            舉個例子,我們有這樣的一個函數(shù):
            var sendAjax = function (url, data, options) { 
            /* ... */
             }
            也許我們想要定義一個新的函數(shù),我們部分提供SendAjax函數(shù)特定的Options,但是允許url和data可以被指定。
            當(dāng)然了,我們能夠相當(dāng)簡單的這樣定義函數(shù):
            var sendPost = function (url, data) {
             return sendAjax(url, data, { type: "POST", contentType: "application/json" });
            };
            或者,使用使用約定的下劃線方式,就像下面這樣:
            var sendPost = sendAjax( _ , _ , { type: "POST", contentType: "application/json" });
            注意兩個參數(shù)以下劃線的方式傳入。顯然,JavaScript并不具備這樣的原生支持,于是我們怎樣才能這樣做呢?
            回過頭讓我們把curry函數(shù)變得智能一點…
            首先我們把我們的“占位符”定義成一個全局變量。
            var _ = {};
            我們把它定義成對象字面量{},便于我們可以通過===操作符來判等。
            不管你喜不喜歡,為了簡單一點我們就使用_來做“占位符”?,F(xiàn)在我們就可以定義新的curry函數(shù),就像下面這樣:
            function curry (fn, length, args, holes) {
             length = length || fn.length;
             args = args || [];
             holes = holes || [];
             return function(){
              var _args = args.slice(0),
               _holes = holes.slice(0),
               argStart = _args.length,
               holeStart = _holes.length,
               arg, i;
              for(i = 0; i < arguments.length; i++) {
               arg = arguments[i];
               if(arg === _ && holeStart) {
                holeStart--;
                _holes.push(_holes.shift()); 
            // move hole from beginning to end
               } else if (arg === _) {
                _holes.push(argStart + i); 
            // the position of the hole.
               } else if (holeStart) {
                holeStart--;
                _args.splice(_holes.shift(), 0, arg); 
            // insert arg at index of hole
               } else {
                _args.push(arg);
               }
              }
              if(_args.length < length) {
               return curry.call(this, fn, length, _args, _holes);
              } else {
               return fn.apply(this, _args);
              }
             }
            }
            實際代碼還是有著巨大不同的。 我們這里做了一些關(guān)于這些“洞”(holes)參數(shù)是什么的記錄。概括而言,運行的職責(zé)是相同的。
            展示下我們的新幫手,下面的語句都是等價的:
            var f = curry(function(a, b, c) { return [a, b, c]; });
            var g = curry(function(a, b, c, d, e) { return [a, b, c, d, e]; });
            // all of these are equivalent
            f("a","b","c");
            f("a")("b")("c");
            f("a", "b", "c");
            f("a", _, "c")("b");
            f( _, "b")("a", "c");
            //=> ["a", "b", "c"]
            // all of these are equivalent
            g(1, 2, 3, 4, 5);
            g(_, 2, 3, 4, 5)(1);
            g(1, _, 3)(_, 4)(2)(5);
            //=> [1, 2, 3, 4, 5]
            瘋狂吧?!
            我為什么要關(guān)心?柯里化能夠怎么幫助我?
            你可能會停在這兒思考…
            這看起來挺酷而且…但是這真的能幫助我編寫更好的代碼?
            這里有很多原因關(guān)于為什么函數(shù)柯里化是有用的。
            函數(shù)柯里化允許和鼓勵你分隔復(fù)雜功能變成更小更容易分析的部分。這些小的邏輯單元顯然是更容易理解和測試的,然后你的應(yīng)用就會變成干凈而整潔的組合,由一些小單元組成的組合。
            為了給一個簡單的例子,讓我們分別使用Vanilla.js, Underscore.js, and “函數(shù)化方式” (極端利用函數(shù)化特性)來編寫CSV解析器。
            Vanilla.js (Imperative)
            //+ String -> [String]
            var processLine = function (line){
             var row, columns, j;
             columns = line.split(",");
             row = [];
             for(j = 0; j < columns.length; j++) {
              row.push(columns[j].trim());
             }
            };
            //+ String -> [[String]]
            var parseCSV = function (csv){
             var table, lines, i; 
             lines = csv.split("\n");
             table = [];
             for(i = 0; i < lines.length; i++) {
              table.push(processLine(lines[i]));
             }
             return table;
            };
            Underscore.js
            //+ String -> [String]
            var processLine = function (row) {
             return _.map(row.split(","), function (c) {
              return c.trim();
             });
            };
            //+ String -> [[String]]
            var parseCSV = function (csv){
             return _.map(csv.split("\n"), processLine);
            };
            函數(shù)化方式
            //+ String -> [String]
            var processLine = compose( map(trim) , split(",") );
            //+ String -> [[String]]
            var parseCSV = compose( map(processLine) , split("\n") );
            所有這些例子功能上是等價的。我有意的盡可能的簡單的編寫這些。
            想要達到某種效果是很難的,但是主觀上這些例子,我真的認(rèn)為最后一個例子,函數(shù)式方式的,體現(xiàn)了函數(shù)式編程背后的威力。
            關(guān)于curry性能的備注
            一些極度關(guān)注性能的人可以看看這里,我的意思是,關(guān)注下所有這些額外的事情?
            通常,是這樣,使用柯里化會有一些開銷。取決于你正在做的是什么,可能會或不會,以明顯的方式影響你。也就是說,我敢說幾乎大多數(shù)情況,你的代碼的擁有性能瓶頸首先來自其他原因,而不是這個。
            有關(guān)性能,這里有一些事情必須牢記于心:
            1.存取arguments對象通常要比存取命名參數(shù)要慢一點
            2.一些老版本的瀏覽器在arguments.length的實現(xiàn)上是相當(dāng)慢的
            3.使用fn.apply( … ) 和 fn.call( … )通常比直接調(diào)用fn( … ) 稍微慢點
            4.創(chuàng)建大量嵌套作用域和閉包函數(shù)會帶來花銷,無論是在內(nèi)存還是速度上
            5.在大多是web應(yīng)用中,“瓶頸”會發(fā)生在操控DOM上。這是非常不可能的,你在所有方面關(guān)注性能。顯然,用不用上面的代碼自行考慮。