如何實現 Function Factory ?
栏目: JavaScript · 发布时间: 5年前
内容简介:在 OOP 的 Factory Function 是用來回傳 Object,而在 FP 有所謂 Function Factory,目的是用來回傳 Function。ECMAScript 2015實務上的 Function Factory 有兩種:
在 OOP 的 Factory Function 是用來回傳 Object,而在 FP 有所謂 Function Factory,目的是用來回傳 Function。
Version
ECMAScript 2015
Function Factory
實務上的 Function Factory 有兩種:
- 根據參數回傳已知 Function
- 根據參數建立新的 Function
根據參數回傳已知 Function
Switch Case
const funcA = () => 'a'; const funcB = () => 'b'; const emptyFunc = () => {}; const factoryFunc = funcName => { switch (funcName) { case 'funcA': return funcA; case 'funcB': return funcB; default: return emptyFunc; } }; console.log(factoryFunc('funcA')()); console.log(factoryFunc('funcB')()); console.log(factoryFunc('funcC')());
已經準備好 funcA
、 funcB
,在 factoryFunc()
由 user 傳入 function 名稱
,就回傳指定的 function。
最直覺的寫法就是使用 switch case
。
Object Literal
const funcA = () => 'a'; const funcB = () => 'b'; const emptyFunc = () => {}; const funcMap = { funcA, funcB, }; const factoryFunc = funcName => funcMap[funcName] || emptyFunc; console.log(factoryFunc('funcA')()); console.log(factoryFunc('funcB')()); console.log(factoryFunc('funcC')());
由於 Object Literal 的 key / value 特性,其實可以用來取代 switch case
,至於 default
則使用 ||
表示。
根據參數建立新的 Function
Higher Order Function
const data = [1, 2, 3]; console.log(data.map(x => x * 2)); console.log(data.map(x => x * 2 + 1));
ECMAScript 提供很多 Higher Order Function,如 Array.prototype
與 setTimeout()
,我們會傳入 Arrow Function。
若 Arrow Function 有重複,或者類似規則的 Arrow Function 不斷出現,則可藉由 Closure 抽出 Function Factory。
const data = [1, 2, 3]; const makeMapper = (a, b) => x => a * x + b; console.log(data.map(makeMapper(2, 0))); console.log(data.map(makeMapper(2, 1)));
抽出 makeMappr()
,藉由傳入不同 argument 給 makeMapper()
產生不同的 Arrow Fuction 給 map()
。
Object Method
const foo = { func1: x => 2 * x + 3, func2: x => 3 * x + 1, }; console.log(foo.func1(1)); console.log(foo.func2(1));
當使用 Object Literal 定義 method 時,若 method 有重複,或者類似規則的 method 不斷出現,則可藉由 Closure 抽出 Function Factory。
const makeFunc = (a, b) => x => a * x + b; const foo = { func1: makeFunc(2, 3), func2: makeFunc(3, 1), }; console.log(foo.func1(1)); console.log(foo.func2(1));
func1()
與 func2()
可藉由 makeFunc()
產生。
抽出 makeFunc()
,藉由傳入不同 argument 給 makeFunc()
產生不同的 method。
Conclusion
- Function Factory 是 FP 在實務上最常使用的技巧,透過 Object Literal 可回傳既有 function,而透過 Closure 則可建立新 function
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网
猜你喜欢:本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
Rework
Jason Fried、David Heinemeier Hansson / Crown Business / 2010-3-9 / USD 22.00
"Jason Fried and David Hansson follow their own advice in REWORK, laying bare the surprising philosophies at the core of 37signals' success and inspiring us to put them into practice. There's no jarg......一起来看看 《Rework》 这本书的介绍吧!