一般的なアプリケーション シナリオ
[1,2,3,4,5].map(x => x * 2).filter(x => x > 5).reduce((p,n) => p + n);
const store = applyMiddleware(...middlewares)(createStore)(reducer, initialState)
関数型プログラミングの特徴は何ですか
機能は「第一級市民」です
関数はパラメータとして他の関数に渡すことができ、関数の戻り値（高階関数）として返すこともできます。
遅延実行
-
遅延実行とは、戻り値が使用される場合にのみ実行される、コード内の特定の関数呼び出しを指します。 -
遅延計算のテクノロジーを使用しているため、関数はコードの作成時に実行されるのではなく、呼び出されたときにのみ実行されます。 -
これにより、無駄な計算が必要なくなるため、パフォーマンスが向上します。
副作用なし (純粋な関数)
-
関数の実行はプログラムの外部状態を変更しません。つまり、関数の実行はプログラムの他の部分に影響を与えません。 -
これは単なる計算結果であり、他の副作用は発生しないためです。
カリー化 - カリー化
// 函数柯里化function curry(fn, args){args = args || []return function(...params){let _args = [...args, ...params]if(_args.length < fn.length){return curry(fn, _args)}return fn.apply(this, _args)}}function sum(a, b, c){return a+b+c}// 自由组合参数const currySum = curry(sum)console.log(currySum(1)(2)(3)) //6console.log(currySum(1)(2,3)) //6console.log(currySum(1,2)(3)) //6
パイプライン-パイプ
export const pipe: any =(...fns: Promise<Function>[]) =>(input: any) =>fns.reduce((chain: Promise<Function>, func: Function | Promise<Function> | any) => chain.then(func), Promise.resolve(input));
组合-compose
export const compose: any =(...fns: Promise<Function>[]) =>(input: any) =>fns.reduceRight((chain: Promise<Function>, func: Function | Promise<Function> | any) => chain.then(func), Promise.resolve(input));
需求背景介绍
-
获取当前批量设置中，所有的配置项信息 -
为每个配置项设计一个处理器（高阶函数）：主要处理【批量设置的配置信息】和【当前单元格的配置信息】合并或替换逻辑 -
通过管道的方式，加工每个单元格所有的配置项信息
核心实现
private pipe = (...args: any) => {return (result: any, config?: any) => {return args.reduce((acc: any, fn: any) => fn(acc, config), result);};};
// 扩展方向替换private handleExpand(expandConf: string) {return (conf: any) => {if (expandConf) {conf.expandDirection = expandConf;}return conf;};}// 父行/父列替换private handleParentCell(columnParentCell: any, rowParentCell: any) {return (conf: any) => {if (columnParentCell?.parentSelectType) {conf.columnParentCell = columnParentCell;}if (rowParentCell?.parentSelectType) {conf.rowParentCell = rowParentCell;}return conf;};}// 条件属性追加private handleCondition(conditionBatchConf: any) {return (conf: any) => {conf.conditionConf = this.mergeCondition(conf?.conditionConf || [], conditionBatchConf);return conf;};}// 批量修改private mergeCondition(c1: any, c2: any) {for (let j = 0; j < c1.length; j++) {// 批量删除if (c1[j]?.batchFlag &&this.batchConf.conditionConf?.find((item: any) => item.uuid === c1[j]?.uuid) &&!c2.find((item: any) => item.uuid === c1[j]?.uuid)) {c1.splice(j, 1);}}for (let j = 0; j < c1.length; j++) {for (let i = 0; i < c2.length; i++) {// 如果字段已存在则替换if (c2[i]?.uuid === c1[j]?.uuid) {c1.splice(j, 1);}}}return [...c1, ...c2];}//...
//...let handles: Array<any> = [];if (cell?.dataConf?.cellType === "文本") {handles = [this.handleExpand(conf.expandDirection),this.handleParentCell(conf.columnParentCell, conf.rowParentCell)];} else if (cell?.dataConf?.cellType === "字段" || cell?.dataConf?.cellType === "公式") {handles = [this.handleExpand(conf.expandDirection),this.handleParentCell(conf.columnParentCell, conf.rowParentCell),this.handleFormat(conf.dataFormatConf),this.handleFilter(conf.cellFilterConf),this.handleCondition(conf.conditionConf)];}if (handles.length > 0) {const mergeConf = this.pipe(...handles)(JSON.parse(JSON.stringify(cell.dataConf)));//...}
-
函数式编程可以可提高代码的可重用性，减少重复代码的开发时间； -
函数式编程可以提高代码的可读性，使得代码更容易理解和调试； -
函数式编程可以更容易实现函数组合，以帮助提高可维护性； -
组合优于继承；
本文分享自微信公众号 - 京东云开发者（JDT_Developers）。
如有侵权，请联系 [email protected] 删除。
本文参与“OSC源创计划”，欢迎正在阅读的你也加入，一起分享。
{{o.name}}
{{m.name}}