js高階技巧之柯里化
阿新 • • 發佈:2019-03-10
- 核心需要注意兩點:引數子集的收集、返回函式
- 下面見bind的封裝中使用到柯里化:
function bind (fn, context) { // 獲取fn、context之外的引數 var args = Array.prototype.slice.call(arguments, 2) return function (){ // 收集內部引數 var innerArys = Array.prototype.slice.call(arguments) // 合併引數 var finalArys = arys.concat(innerArys); return fn.apply(context, finalArys); } }
- 見使用例子:
var handler = { message: 'event handled', handlerClick: function (param1, param2, event) { console.log(event); console.log(this.message + ':' + param1 + ':' + param1); } }; var btn = document.getElementById('myBtn'); btn.onclick = bind(handler.handlerClick, handler, 'zhanhui', 'shihuan'); // 執行的過程中引數的收集步驟是: // 1.先收集外部引數'zhanhui'和'shihuan'這兩個字串 // 2.接著收集內部引數event // 3.最後將這三個引數合併,並一併傳給handler.handlerClick
- 平時擼程式碼中經常用到場景有如下幾種:
- 引數複用
- 延遲執行,返回的是函式。
- 下面見例子:
1.減少重複傳遞不變的部分引數 2.將柯里化後的callback引數傳遞給map, filter等函式。 3.後續補充程式碼示例 https://segmentfault.com/a/1190000015281061?utm_source=tag-newest