JavaScript前端面试组合函数
codesky · 122浏览 · 发布于2022-06-16 +关注

这篇文章主要为大家介绍了JavaScript前端面试组合函数详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪


经历过一些列的函数式编程思想的学习总结,一些重要的高阶函数的学习,以及前一段时间关于 RxJS 的学习。

我们再回看一次 —— 组合函数 compose

本瓜越来越觉得,【易读】的代码应该是将声明和调用分开来的。根据不同的流程,用函数组合的方式、也可以说它是管道、或者说是链式调用,将声明的函数组合起来,再等待时机进行调用。

如果没有组合函数 compose,函数连续调用将会是嵌套的:

const multi10 = function(x) { return x * 10; }
const toStr = function(x) { return `${x}`; }
const compute = function(x){
    return toStr(multi10(x))
}
compute(8)


fn3(fn2(fn1(fn0(x)))),层层嵌套是很容易看错的; 

所以,必须尝试将调用层级扁平化!

compose 应运而生,它大概就会是这样:

const compose = function(f,g) {
    return function(x) {
        return f(g(x))
    }
}

 

let compute = compose(toStr, multi10)
compute(8)


通过使用compose函数我们可以把两个函数组合成一个函数,这让代码从右往左执行,而不是层层计算某个函数的结果作为另一个函数的参数,这样代码也更加直观。

当然,我们不能让 compose 限制于只能处理连续调用两个函数,于是支持任意参数版本的 compose 将是这样的:

function compose(...funs){
    return (x) =>funs.reduce((acc, fun) => fun(acc), x)
}


通过函数组合,我们可以可以声明式地指定函数间的关系,代码的可读性也大大提高,也方便我们后续对代码进行扩展跟重构; 

而且在React里面,当我们的高阶组件变多的时候,一个套着一个就很难看,我们就可以通过类似的方式来让我们的高阶组件层级扁平化;

这就是最最原始的 compose,以及它被提出的原始动机~~


相关推荐

PHP实现部分字符隐藏

沙雕mars · 1116浏览 · 2019-04-28 09:47:56
Java中ArrayList和LinkedList区别

kenrry1992 · 610浏览 · 2019-05-08 21:14:54
Tomcat 下载及安装配置

manongba · 695浏览 · 2019-05-13 21:03:56
JAVA变量介绍

manongba · 791浏览 · 2019-05-13 21:05:52
什么是SpringBoot

iamitnan · 724浏览 · 2019-05-14 22:20:36
加载中

0评论

评论
分类专栏
小鸟云服务器
扫码进入手机网页