JS每日一题:函数式编程中代码组合(compose)如何理解?

38次阅读

共计 1517 个字符,预计需要花费 4 分钟才能阅读完成。

20190315 期
函数式编程中代码组合 (compose) 如何理解?
定义: 顾名思义,在函数式编程中,Compose 就是将几个有特点的函数拼凑在一起,让它们结合,产生一个崭新的函数
代码理解:
// 一个将小写转大写的函数
let toUpperCase = (x) => x.toUpperCase();

// 一个在字符后加!的函数
let exclaim = (x) => x + ‘!’;

// 将两个函数组合起来, 这里假设我们实现了 compose
let shout = compose(toUpperCase,exclaim);

shout(‘js 每日一题 ’) // JS 每日一题 !, 显示结果里上面两个函数的特点都应用上了

pointfree
代码组合中有一个重要的概念 pointfree(永远不要说出你的数据), 它的意思是指函数无须提及将要操作的数据是什么样的
有点晦涩,我们还是上代码理解一下
// 我们有一个将字符转换成大写并且将其空格转换为 ’-‘ 的函数
// 细节的同学应该发现这个函数暴露了一个 word 形参
// 根据 pointfree 定义,此函数非 pointfree 模式
let snakeCase = (word) => word.toUpperCase().replace(/\s+/ig,’-‘);

// 下面这个函数与上面的功能一致,但我们可以观察到其没有数据暴露, 所以其为 pointfree 模式
let snakeCase = compose(replace(/\s+/ig,’-‘),toUpperCase)
说了这么多,他能干什么呢 ? 它能够帮助我们减少不必要的命名,让代码保持简洁和通用
compose 实现
上面我们都是假设已经存在 compose 方法, 接下来我们来为其实现
首先分析其特性

两个函数都有一个共同的参数
函数的执行顺序从右至左
前面函数执行的结果交由后面的函数处理

根据上面的示例及我们分析的特性来实现一个最简版的
// 这样子其实就能满足我们上面示例的要求了
const compose = function(f, g) {
return function(x) {
return f(g(x));
};
};
结束了吗? 并没有, 我们可以看到上面的 compose 示例都只是传入了两个函数,因为我们的简版 compose 实现也只支持两个函数,那么如果我们想要支持一条很长很长的管道的时候,显然上面的 compose 就不够用了, 接着我们来看优秀的开源库 redux 的 compose 实现
// 摘自 https://github.com/reactjs/redux/blob/master/src/compose.js
export default function compose(…funcs) {
// 没有传入函数运行直接返回参数
if (funcs.length === 0) {
return arg => arg
}
// 只传入一个函数,就返回其本身
if (funcs.length === 1) {
return funcs[0]
}

// 核心代码其实就是一句 reduce, reduce 特性就是按顺序执行,并且将结果传递给下一次执行, 这里多说一句, reduce 顺序执行多个相依赖的 promise 也很好用
return funcs.reduce((a, b) => (…args) => a(b(…args)))
}
总结

将多个单特性的函数组合到一起的函数
多个函数服务一组数据(共同参数)
不必说出数据(pointfree)
函数从右至左顺序执行,结果做为下一个函数的参数

关于 JS 每日一题
JS 每日一题可以看成是一个语音答题社区 每天利用碎片时间采用 60 秒内的语音形式来完成当天的考题 群主在次日 0 点推送当天的参考答案
注 绝不仅限于完成当天任务,更多是查漏补缺,学习群内其它同学优秀的答题思路
点击加入答题

正文完
 0