JavaScript函数式编程(Functional Programming)高阶函数(Higher order functions)用法分析


Posted in Javascript onMay 22, 2019

本文实例讲述了JavaScript函数式编程(Functional Programming)高阶函数(Higher order functions)用法。分享给大家供大家参考,具体如下:

高阶函数(higher-order functions),就是返回其它函数的函数,或者使用其它函数作为它的参数的函数。

使用函数作为参数

因为函数本身就是一个值,所以可以让函数作为参数传递给其它的函数。JavaScript 有些函数就需要用到函数类型的参数,比如 Array.map。

比如我有一组数据:

const names = ['小猫', '小狗', '小刺猬']

我要分别问候一下这组数据里的每个项目:

const greetings = names.map(function(name) {
 return `hi ~ ${name}`
})
console.log(greetings)
// ["hi ~ 小猫", "hi ~ 小狗", "hi ~ 小刺猬"]

上面的 map 方法里用了一个匿名函数作为它的参数。在这个函数里面,我们在数组里的每个项目的前面都加上了一个 “hi ~” ,map 会返回一个新的数组,这个数组我交给了 greetings 变量。

用箭头函数会更简洁一些:

const greetings = names.map(name => `hi ~ ${name}`)

高阶函数

高阶函数(higher-order functions)。在 JavaScript 里面,函数跟普通的对象没啥大区别,所以你可以让函数作为参数传递到其它的函数里面,你也可以在函数里返回函数。使用函数作为参数的函数,或者返回函数的函数,这些函数被称为高阶函数(higher-order functions)。

比如刚才我们用的 map 就是一个高阶函数,因为它会用到一个函数作为它的参数。

再看一个例子:

const robot = (name, action) => {
 return action(name)
}
const greet = (name) => {
 return `hello, ${name}`
}
const greeting = robot(' 您好 ', greet)
// 返回 “ hello, 您好 ”

robot 是个函数,它支持两个参数,name 与 action,这里的 action 参数的类型是一个函数。在 robot 里面返回了 action ,并且把 name 参数的值交给了 action。接下面我们又定义了一个函数叫 greet,它接受一个参数是 name ,这个函数会返回一个字符串。

然后我们用了一下 robot 这个函数,设置了一下它的两个参数的值,name 参数的值是 ' 您好 ‘,action 参数的值是我们定义的 greet 这个函数。执行的结果就会是:

hello, 您好

我们可以再去定义一下函数:

const goodbye = (name) => {
 return `bye, ${name}`
}

然后再用一下 robot 函数:

const byeBye = robot(' 您好 ', goodbye)

这次会返回:

bye, 您好

完整的例子:

const robot = (name, action) => {
 return action(name)
}
const greet = (name) => {
 return `hello, ${name}`
}
const greeting = robot(' 您好 ', greet)
console.log(greeting)
const goodbye = (name) => {
 return `bye, ${name}`
}
const byeBye = robot(' 您好 ', goodbye)
console.log(byeBye)

更多关于JavaScript相关内容可查看本站专题:《JavaScript常用函数技巧汇总》、《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript如何创建表格(javascript绘制表格的二种方法)
Dec 10 Javascript
node.js中的http.createServer方法使用说明
Dec 14 Javascript
JavaScript 基本概念
Jan 20 Javascript
jQuery中大家不太了解的几个方法
Mar 04 Javascript
javascript实现简单的省市区三级联动
May 14 Javascript
BootStrap响应式导航条实例介绍
May 06 Javascript
基于js中的原型、继承的一些想法
Aug 10 Javascript
javascript 中设置window.location.href跳转无效问题解决办法
Feb 09 Javascript
Bootstrap4如何定制自己的颜色和风格
Feb 26 Javascript
jQuery实现每隔一段时间自动更换样式的方法分析
May 03 jQuery
Vue项目中使用better-scroll实现一个轮播图自动播放功能
Dec 03 Javascript
jQuery与原生JavaScript选择HTML元素集合用法对比分析
Nov 26 jQuery
浅谈VUE防抖与节流的最佳解决方案(函数式组件)
May 22 #Javascript
详解在React-Native中持久化redux数据
May 22 #Javascript
微信小程序的注册页面包含倒计时验证码、获取用户信息
May 22 #Javascript
JavaScript函数式编程(Functional Programming)纯函数用法分析
May 22 #Javascript
jQuery Migrate 插件用法实例详解
May 22 #jQuery
自定义Vue组件打包、发布到npm及使用教程
May 22 #Javascript
Vue中的组件及路由使用实例代码详解
May 22 #Javascript
You might like
Windows下安装PHP单元测试环境PHPUnit图文教程
2014/10/24 PHP
ThinkPHP中处理表单中的注意事项
2014/11/22 PHP
PHP入门教程之使用Mysqli操作数据库的方法(连接,查询,事务回滚等)
2016/09/11 PHP
微信公众号开发之获取位置信息php代码
2018/06/13 PHP
PHP封装的数据库模型Model类完整示例【基于PDO】
2019/03/14 PHP
什么是PHP7中的孤儿进程与僵尸进程
2019/04/14 PHP
jquery 入门教程 [翻译] 推荐
2009/08/17 Javascript
Raphael带文本标签可拖动的图形实现代码
2013/02/20 Javascript
form表单中去掉默认的enter键提交并绑定js方法实现代码
2013/04/01 Javascript
JavaScript中实现最高效的数组乱序方法
2014/10/11 Javascript
javascript实现带下拉子菜单的导航菜单效果
2015/05/14 Javascript
Javascript复制实例详解
2016/01/28 Javascript
再次谈论React.js实现原生js拖拽效果引起的一系列问题
2016/04/03 Javascript
基于ES6 Array.of的用法(实例讲解)
2017/09/05 Javascript
Angular利用内容投射向组件输入ngForOf模板的方法
2018/03/05 Javascript
详解redux异步操作实践
2018/08/15 Javascript
jQuery实现基本动画效果的方法详解
2018/09/06 jQuery
深入理解移动前端开发之viewport
2018/10/19 Javascript
jquery实现动态添加附件功能
2018/10/23 jQuery
JavaScript学习笔记之基于定时器实现图片无缝滚动功能详解
2019/01/09 Javascript
记录微信小程序 height: calc(xx - xx);无效问题
2019/12/30 Javascript
详解Python中用于计算指数的exp()方法
2015/05/14 Python
浅谈插入排序算法在Python程序中的实现及简单改进
2016/05/04 Python
python中文乱码不着急,先看懂字节和字符
2017/12/20 Python
python如果快速判断数字奇数偶数
2019/11/13 Python
Python如何使用函数做字典的值
2019/11/30 Python
pytorch模型预测结果与ndarray互转方式
2020/01/15 Python
关于tensorflow softmax函数用法解析
2020/06/30 Python
Django配置Bootstrap, js实现过程详解
2020/10/13 Python
机电系毕业生求职信
2014/07/11 职场文书
2014年销售部工作总结
2014/12/01 职场文书
党员转正意见怎么写
2015/06/03 职场文书
为自己工作观后感
2015/06/11 职场文书
事业单位工作人员2015年度思想工作总结
2015/10/15 职场文书
Mysql数据库值的添加、修改、删除及清空操作实例
2021/06/20 MySQL
HTML中的表单元素介绍
2022/02/28 HTML / CSS