如何實現 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
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网
猜你喜欢:本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
Nginx Essentials
Valery Kholodkov / Packt Publishing / 2015-7-1 / USD 34.99
About This Book Learn how to set up, configure, and operate an Nginx installation for day-to-day useExplore the vast features of Nginx to manage it like a pro, and use them successfully to run your......一起来看看 《Nginx Essentials》 这本书的介绍吧!