建站
咨询
售后
建站咨询
这篇文章主要介绍JavaScript函数式编程中代码组合的示例分析，文中介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们一定要看完！
函数式编程中代码组合(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)
函数从右至左顺序执行，结果做为下一个函数的参数
以上是“JavaScript函数式编程中代码组合的示例分析”这篇文章的所有内容，感谢各位的阅读！希望分享的内容对大家有帮助，更多相关知识，欢迎关注创新互联行业资讯频道！
另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。
本文标题：JavaScript函数式编程中代码组合的示例分析-创新互联
链接URL：http://lswzjz.com/article/ddscii.html
