国产成人精品久久免费动漫-国产成人精品天堂-国产成人精品区在线观看-国产成人精品日本-a级毛片无码免费真人-a级毛片毛片免费观看久潮喷

您的位置:首頁技術文章
文章詳情頁

javascript - 求助關于call和apply的問題,反柯里化

瀏覽:114日期:2022-12-15 15:57:36

問題描述

下面是uncurring的兩種實現

實現1

Function.prototype.uncurrying = function(){ var self = this; return function(){// 獲取傳入的上下文對象var context = Array.prototype.shift.call(arguments);// 這里的this是調用uncurrying者return self.apply(context, arguments); };};var push = Array.prototype.push.uncurrying ();var arr = [];push(arr, 1); // ==> arr = [1]push(arr, 4); // ==> arr = [1, 4]

實現2

Function.prototype.uncurrying = function(){ var self = this; return function(){return Function.prototype.call.apply(self, arguments); };};var push = Array.prototype.push.uncurrying ();var arr = [];push(arr, 1); // ==> arr = [1]push(arr, 4); // ==> arr = [1, 4]

兩種結果是一樣的,但是第二種實現的方式我有點迷糊,主要是這里

第一種方式顯示的用self,在這里也就是push方法執行了一下, self.apply(context, arguments);但是如下第二種實現方式,卻沒有發現self執行的痕跡,按我的理解這里就是用apply修改call的上下文為self,這里也就是push,但這樣有執行push方法嗎?難道call內部的實現幫忙執行了self?求解 Function.prototype.call.apply(self, arguments);

瞬間被你點通,謝謝 !

louiszhai

Function.prototype.call.apply(self, arguments);先用apply修改了call的上下文為self,后續調用uncurrying,相當于在self上調用call方法,也就執行了self

問題解答

回答1:

Function.prototype.call.apply(self, arguments);這個看起來有些繞,其實很好理解。實際上,由你的第二種實現還可以推出反柯里化的第三種實現

Function.prototype.unCurrying = function () { return this.call.bind(this);};var push = Array.prototype.push.unCurrying(), obj = {};push(obj, ’123’, ’456’);console.log(obj); //Object {0: '123', 1: '456', length: 2}

接下來我會先分析下你的第二種實現,再分析第三種實現。你的實現是這樣的:

Function.prototype.uncurrying = function(){ var self = this; return function(){return Function.prototype.call.apply(self, arguments); };};var push = Array.prototype.push.uncurrying();

誰調用uncurrying,誰就等于this或self. 這意味著self就是數組的push方法.替換掉self,最終外部的push等同如下函數:

function(){ return Function.prototype.call.apply(Array.prototype.push, arguments);};

函數放在這里,我們先來理解apply函數,apply有分解數組為一個個參數的作用。

推導公式:a.apply(b, arguments) 意味著把b當做this上下文,相當于是在b上調用a方法,并且傳入所有的參數,如果b中本身就含有a方法,那么就相當于 b.a(arg1, arg2,…)

公式1:a.apply(b, arguments) === b.a(arg1, arg2,…)

由于call 和 apply 除參數處理不一致之外,其他作用一致,那么公式可以進一步演化得到:

公式2:a.call(b, arg) === b.a(arg)

公式1這些代入上面的函數,有:

a = Function.prototype.call 即a等于call方法。

我們接著代入公式,有:

b = Array.prototype.push 即b等于數組的push方法

那么 Function.prototype.call.apply(Array.prototype.push, arguments)就相對于:

Array.prototype.push.call(arg1, arg2,…),那么:

push([], 1) 就相當于 Array.prototype.push.call([], 1),再代入公式2,相當于:

[].push(1)

答案已經呼之欲出了,就是往數組中末尾添加數字1。

接下來我來分析反柯里化的第三種實現:

對于this.call.bind(this);部分,this相當于Array.prototype.push,那么整體等同于如下:

Array.prototype.push.call.bind(Array.prototype.push)

這里的難點在于bind方法,bind的實現比較簡單,如下:

Function.prototype.bind = function(thisArg){ var _this = this; var _arg = _slice.call(arguments,1); return function(){ var arg = _slice.call(arguments); arg = _arg.concat(arg); return _this.apply(thisArg,arg); }}

想要理解必須化繁為簡,理解得越簡單,也就理解得越透徹。進一步簡化bind的原理,等同于誰調用bind,就返回一個新的function。

我們假設函數fn調用bind方法如fn.bind([1, 2]),經過簡化,忽略bind綁定參數的部分,最終返回如下:

function(){ return fn.apply([1, 2], arguments);}

以上,將fn替換為 Array.prototype.push.call,[1, 2]替換為 Array.prototype.push,那么:

Array.prototype.push.call.bind(Array.prototype.push) 將等同于:

function(){ return Array.prototype.push.call.apply(Array.prototype.push, arguments);}

這個看起來和反柯里化的第二種實現有些不大相同,不要急,雖然表面上看起來不一致,但骨子里還是一致的。請耐心往下看:

不同的地方在于前半部分 Array.prototype.push.call,這里它是一個整體,實際上想代表的就是call方法。而我們都知道,所有函數的call方法,最終都是Function.prototype 的 call方法。那么,就有如下恒等式成立:

Array.prototype.push.call === Function.prototype.call //true

那么以上函數將等同于:

function(){ return Function.prototype.call.apply(Array.prototype.push, arguments);}

褪去代入的參數,函數可還原為:

function(){ return Function.prototype.call.apply(self, arguments);}

綜上,最終反柯里化的第三種實現將和第二種實現完全一致,推理完畢,碼字不易,喜歡的請點個贊謝謝~

為了加深對bind 和 柯里化的理解,我還專門撰寫了博客深入分析它們。

請參看 函數式編程之柯里化與反柯里化 、Function.prototype.bind方法指南 。

喜歡的同學還可以關注我的專欄路易斯前端深度課

回答2:

基礎call和apply的區別和作用不再贅述

call和apply源碼實現他們很接近,這里只介紹call,舉個例子:a.call(b, c)

取出第一個參數x = b || {}

x.fn = a

拼接除第一個參數以外的參數,用逗號分隔,結果為d

創建獨立執行環境的函數e = new Function(),函數內部執行x.fn(d)

執行創建的e

方案二的理解這里就不考慮call和apply擴大對象方法的問題,因為從源碼中方法都會動態創建,以下就不再贅述這個問題。

Function.prototype.call.apply(self, arguments);var push = Array.prototype.push.uncurrying ();

self指向Array.prototype.push

(Function.prototype.call).apply(Array.prototype.push, arguments);

利用剛講解的源碼,把2變形,得出:Array.prototype.push.(Function.prototype.call)(arguments),這里還需要轉化,call接受的不是數組,見4。

arguments是類數組對象[arr, 1],把3變形,得出:Array.prototype.push.(Function.prototype.call)(arr, 1)

call的源碼已經解釋過,于是變化4,得出arr.(Array.prototype.push)(1)

寫得好看一點,arr.push(1)

標簽: JavaScript
主站蜘蛛池模板: 黄在线观看在线播放720p | 91青草久久久久久清纯 | 日韩 国产 欧美视频一区二区三区 | 欧美一级片免费在线观看 | 亚洲精品一区专区 | 精品国产免费一区二区三区五区 | 一级片网站在线观看 | 国产成人精品日本亚洲专区6 | 亚洲第5页| 欧美一级在线全免费 | 亚洲日韩中文字幕 | 亚洲精品成人一区二区www | 欧美日韩一区二区视频免费看 | 宫女淫春3在线观 | 一级做a爰片久久毛片 | 一区二区三区高清视频在线观看 | 在线步兵区 | 欧美一级日韩在线观看 | 国产精品一区二区三区免费 | 欧美一区二区aa大片 | 国产性大片黄在线观看在线放 | 久久亚洲精品成人 | 成人午夜视频在线观 | 亚洲在线一区二区三区 | 国产成人在线视频免费观看 | 欧美美女一区二区三区 | 日韩免费在线 | 国产成人ay手机在线观看 | 亚洲精品国产第一区二区多人 | 国产成人aa在线观看视频 | 亚洲一区二区在线成人 | 一级国产a级a毛片无卡 | 国产亚洲小视频 | 在线播放国产真实女同事 | 亚洲视频在线免费 | 女人张开腿给人桶免费视频 | 视频二区在线观看 | 日本亚洲欧美在线 | 日本三级香港三级网站 | 激情6月丁香婷婷色综合 | 国产老鸭窝毛片一区二区 |