广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >JavaScript前端面试组合函数
  • 146
分享到

JavaScript前端面试组合函数

2024-04-02 19:04:59 146人浏览 八月长安
摘要

经历过一些列的函数式编程思想的学习总结,一些重要的高阶函数的学习,以及前一段时间关于 Rxjs 的学习。 我们再回看一次 —— 组合函数 compose 本瓜

经历过一些列的函数式编程思想的学习总结,一些重要的高阶函数的学习,以及前一段时间关于 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,以及它被提出的原始动机~~

以上就是javascript前端面试组合函数的详细内容,更多关于JavaScript组合函数的资料请关注编程网其它相关文章!

--结束END--

本文标题: JavaScript前端面试组合函数

本文链接: https://www.lsjlt.com/news/151699.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • JavaScript前端面试组合函数
    经历过一些列的函数式编程思想的学习总结,一些重要的高阶函数的学习,以及前一段时间关于 RxJS 的学习。 我们再回看一次 —— 组合函数 compose 本瓜...
    99+
    2022-11-13
  • JS前端面试数组扁平化手写flat函数示例
    目录前言题目 实现扁平化的方法 封装 flatten1. ES6 flat2. toString3. 使用正则替换4. 循环递归4.1 循环 + concat + push...
    99+
    2022-11-13
  • JS前端面试数组扁平化手写flat函数示例分析
    本文小编为大家详细介绍“JS前端面试数组扁平化手写flat函数示例分析”,内容详细,步骤清晰,细节处理妥当,希望这篇“JS前端面试数组扁平化手写flat函数示例分析”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。题...
    99+
    2023-07-02
  • 前端面试JavaScript高频手写大全
    目录1. 手写instanceof2. 实现数组的map方法 3. reduce实现数组的map方法 4. 手写数组的reduce方法 5. 数组扁平化 5. 1 es6提供的新方法...
    99+
    2022-11-12
  • 2022最新前端常见react面试题合集
    目录react性能优化方案什么是 React Context何为 JSXprops 是什么应该在 React 组件的何处发起 Ajax 请求react 强制刷新使用 React Ho...
    99+
    2022-11-13
  • Javascript前端经典的面试题有哪些
    这篇文章将为大家详细讲解有关Javascript前端经典的面试题有哪些,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。一、JavaScript 的 typeof 返回哪些数...
    99+
    2022-10-19
  • JavaScript前端面试扁平数据转tree与tree数据扁平化
    目录一、写在前面二、正文部分2.1 扁平数据转为 tree 数据2.2 tree 数据转为扁平数据2.3 完整测试 demo三、写在后面一、写在前面 有时我们拿到的数据的数据结构可能...
    99+
    2022-11-13
  • 前端数组去重面试我会问这3个小问题
    目录前言一、请说一下数组去重的项目使用场景 1、时间轴2、前端银行属地显示实例二、说一下数组去重的几种实现方法吧 1、第1种2、第2种 3、第3种&nb...
    99+
    2023-01-15
    前端数组去重的方法 数组快速去重 js中数组去重常用方法
  • javascript函数组合是什么
    这篇文章给大家分享的是有关javascript函数组合是什么的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。说明假如一个函数要经过多个函数处理才能得到最终的值,这时可以将中间过程的函数合并为一个函数。函数可以看作数...
    99+
    2023-06-20
  • 好程序员Web前端面试题Javascript篇汇总
    好程序员Web前端面试题Javascript篇汇总,相信现在参加Web前端面试的人一定不少,为了帮助大家顺利的通过面试,今天准备了前端面试题系列,通过Web知识的整理以及经验的总结,希望能帮到更多的即将参加前端面试的小伙伴。JavaScri...
    99+
    2023-06-03
  • Python 中的函数和数组:面试前必须掌握的知识点!
    Python 是一种高级编程语言,它的语法简洁明了,易于学习。在 Python 中,函数和数组是两个非常重要的概念,是每个 Python 开发人员必须掌握的知识点。本文将介绍 Python 中的函数和数组,以及如何在面试中展示您的知识。 ...
    99+
    2023-11-06
    函数 数组 面试
  • JavaScript组合函数怎么使用
    这篇文章主要讲解了“JavaScript组合函数怎么使用”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“JavaScript组合函数怎么使用”吧!如果没有组合函数 compose,函数连续调用...
    99+
    2023-07-02
  • JavaScript前端实用的工具函数封装
    目录1.webpack里面配置自动注册组件2.自定义指令图片懒加载3.图片文件转base64格式(实现预览)4.数组转为tree型结构(递归实现)5.递归深拷贝6.将数组里面的对象转...
    99+
    2022-11-13
  • 面试必备:PHP 数组函数详解!
    PHP 数组函数是在 PHP 编程中非常重要的一部分,它们可以帮助我们在数组中进行各种操作,如添加、删除、排序、搜索等。在 PHP 开发中,数组是一个非常常用的数据结构,因此了解 PHP 数组函数是非常重要的。 下面我们来详细介绍一些常用的...
    99+
    2023-06-18
    数组 面试 函数
  • 常见的前端开发:Javascript 面试题及回答策略
    不管你是面试官还是求职者,里面的思路都能让你获益匪浅。单体应用和微服务架构之间有哪些主要区别,从灵活性和可扩展性的角度来看,哪个是更好选择?解析:这个问题用来评估基础编码知识。答案可以有多种,所以应该注意倾听具体的问题,并尽量全面回答,来展...
    99+
    2023-06-03
  • 学前端求职难?千锋Web前端面试题全套视频合集助你快速通关
    2020年初的一场意外,阻碍了很多人前进的脚步,计划跳槽、转行被迫留守在家。而近日“4个下降、1个增加、部分省份零报告”充分释放了疫情好转的信号,企业复工有望,求职面试只待机会。一直有人说Web前端求职难,虽然行业前景好,但行业内的竞争对手...
    99+
    2023-06-03
  • 前端JavaScript彻底弄懂函数柯里化curry
    目录一、什么是柯里化( curry)二、柯里化的用途三、如何封装柯里化工具函数 一、什么是柯里化( curry) 在数学和计算机科学中,柯里化是一种将使用多个参数的一个函数转换成一系...
    99+
    2022-11-12
  • JavaScript数组面试题实例分析
    今天小编给大家分享一下JavaScript数组面试题实例分析的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。 晚上下...
    99+
    2023-06-27
  • 前端进阶之教你利用javascript存储函数
    目录前言背景介绍实现方案思考js存储函数方案设计最后总结前言 任何一家Saas企业都需要有自己的低代码平台.在可视化低代码的前端研发过程中, 发现了很多有意思的技术需求, 在解决这些...
    99+
    2022-11-12
  • 前端面试项目冲刺 京东金融Vue组件化实战
    String 立即前往 = " http://icourse8.com/vue_jujinahua.html ";第1章 课程介绍    第...
    99+
    2023-06-03
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作