高阶函数和回调函数的区别

简介: 高阶函数和回调函数的区别

今天看到高阶函数的概念,突然就迷不过来了,这个高阶函数和回调有什么区别呢?

高阶函数英文叫Higher-order function。那么什么是高阶函数?

刚开始学习语言我最害怕看到这种XX函数的,一看到就想跳过,结果跳过了发现后面好多知识点都无法理解。 我们完全没必要把它想的多么高深,其实高阶函数你在学习到这个阶段的时候已经使用过很多高阶函数了,只不过你之前不知道它们还有这个特殊的称呼。 最简单的例子就是

setTimeout(fn,delay)

一个函数A接收另外一个函数B作为参数,那么这个函数A就叫做高阶函数,fn就叫做setTimeout的回调函数。 记住一点,高阶函数和回调函数的概念是两个函数相互搭配使用,才能叫做高阶函数和或者某某函数的回调函数的。单独的一个函数fn是无法叫做高阶函数的!

回调函数的概念我写过一篇博客,如有需要,可以翻看我的个人文章,内容没有专业名词,简单易懂。

函数还有一个方式也可以成为高阶函数,那就是返回值也是一个函数。如果你了解过防抖和节流,你可能一下子就会明白这个使用方法。下面例子与防抖节流无关。 到这里你就已经可以分清楚什么是高阶函数和回调函数了。

分割线,以下是这个概念自己写的进阶笔记,写的比较绕,初学者可能看不懂代码,请选择观看。

<------------------------------------------------------>

image.png

这是我写的一段代码,我想实现的功能是当我鼠标移动到li标签里时候,出现删除的按钮。

image.png

image.png

image.png

逻辑是我需要判断li标签的id是否和它的索引相同,然后把button的opacity改变。这里使用的是

image.png

image.png

因为我需要传递参数数组的id值,给onMouseEnter这个函数的回调函数也就是handleMOuse,但是我们需要搞清楚的是下面写法的原因👇为什么要这样写。

image.png

不管是onClick和OnChange等这些事件,都需要一个函数作为它的回调来使用,注意!这些事件需要你给它提供一个函数

onMouseEnter={handleMouse(iterm.id)}

当你这样写的时候,你需要明白,浏览器调用render()函数的时候,你的handleMouse是函数名,但是一旦你带括号,就说明你在执行它!!!!这个概念非常重要,需要理清楚。所以走到这一行会执行这个函数, 但是如果这时候你这个函数的返回值为空或者不为函数,那么就不会得到你想要的结果,那么我们的目的就是让浏览器先执行一个函数A(目的是拿到参数),然后让函数A再返回一个函数B,这时候函数B才是触发这个具体事件的函数。

很绕,需要多多理解。

image.png

上面代码的意思是,当浏览器调用render方法的时候,会首先执行

image.png

这段代码,然而这段代码函数A的作用只是把我们需要的参数传递进去,真正意义上的函数是这个函数A的返回值

image.png

这里的e才是 onMOuseEnter事件对象。至此我们拿到了我们需要对比的参数并且进行逻辑判断。

高阶组件


image.png

有什么用呢?包装组件把被包装组件加工以后,返回一个新的组件。

可以看作 包装组件是被包装组件的父组件,那么就会给 被包装组件一个props属性

相关文章
|
数据可视化 数据挖掘 API
【R语言实战】聚类分析及可视化
【R语言实战】聚类分析及可视化
|
9月前
|
SQL 自然语言处理 IDE
LLM的IDE使用一段时间后的体会
使用Windsurf开发Web应用,全程无需手写代码,仅通过自然语言交流指导大模型完成任务。初期体验流畅高效,尤其适合快速实现小规模项目。然而,面对需求变更时,代码设计易受影响,需细致指导大模型以保持良好设计。整体而言,LLM辅助编程如同结对编程中的导航员角色,用户需提升自身指导能力以发挥其最大效能。
306 0
LLM的IDE使用一段时间后的体会
|
11月前
|
存储 JavaScript 前端开发
如何使用Vue.js实现一个简单的待办事项应用
【10月更文挑战第1天】如何使用Vue.js实现一个简单的待办事项应用
279 5
|
Cloud Native Java 数据库
深入理解Micronaut依赖注入:提高应用灵活性的最佳实践
【9月更文挑战第5天】Micronaut是一个轻量级全栈业务框架,支持Java与Groovy语言,以其优秀的性能和对云原生特性的深度集成而备受关注。本文探讨Micronaut中的依赖注入机制,通过示例展示如何利用构造函数注入、字段注入及方法注入等方式提高应用灵活性。通过合理的依赖注入策略,如使用`@Qualifier`注解选择具体实现或条件化注册Bean,可构建更易扩展和维护的应用。Micronaut简化了这一过程,使开发者能专注于业务逻辑。
170 2
|
Java
Java SpringBoot FTP 上传下载文件
Java SpringBoot FTP 上传下载文件
443 0
|
SQL 数据处理 数据库
深入解析SQL中的MERGE语句及其重要性
【8月更文挑战第31天】
362 0
|
存储 JavaScript 前端开发
浮点数不再神秘:JS浮点数精度详解
浮点数不再神秘:JS浮点数精度详解
|
自然语言处理 索引
Elasticsearch 常用查询语句大全
【7月更文挑战第8天】Elasticsearch 常用查询语句大全
|
Web App开发 JavaScript 前端开发
nodejs入门,这一篇就够了
nodejs入门,这一篇就够了
1837 0
nodejs入门,这一篇就够了
|
运维 算法 程序员
不会写文档的程序员不是好的程序员
在IT行业中,文档是一种非常重要的沟通工具。它可以帮助程序员和客户及团队成员之间进行有效的沟通和协作,提高工作效率和项目成功率。然而,许多程序员往往忽视了文档的重要性,认为只要代码写得很好就可以了。但实际上,一个优秀的程序员不仅需要精通编码,还需要具备良好的文档编写能力。
273 2