ES6中的高阶函数:如同 a = b = c 一样简单
2019独角兽企业重金招聘Python工程师标准>>>
作者:Sequoia McDowell
2016年01月16日
ES6来啦!随着越来越多的代码库和思潮引领者开始在他们的代码中使用ES6,以往被认为是“仅需了解”的ES6特性变成了必需的代码常识。这不仅仅是新的语法学习 - 在许多范例中, ES6中新的语言特性可以让在ES5中写起来非常麻烦的表达变得更加简单,进而鼓励了新表达方式的使用。下面我们将关注一个这样简洁表达的使用范例:ES6中的箭头函数如何使高阶函数的书写更加简便。
高阶函数是至少具有以下两种功能之一的函数:
- 使用一个或多个函数作为实参
- 返回一个函数作为结果
本文的目的并不是说服你立即采用这种新方式,尽管笔者非常鼓励你尝试使用!本文旨在让你熟悉这种表达方式,这样当你在遇到其他人基于ES6写的代码库时,不会如笔者当初一样看着这些陌生代码挠头不解。如果你在此之前需要先复习一下箭头语法的知识,请先查阅这篇文章。
希望你熟悉有返回值的箭头函数:
const square = x => x * x;
但是下面这两行代码是什么意思?
const has = p => o => o.hasOwnProperty(p);
const sortBy = p => (a, b) => a[p] > b[p];
“p 返回 o 返回 o.hasOwnProperty…”这句代码是什么意思?我们能这样用吗?
##理解语法
为了说明带箭头的高阶函数的书写规则,让我们一起来看一个经典示例:加法函数。在ES5中会这样写:
function add(x){return function(y){return y + x;};
}
var addTwo = add(2);
addTwo(3); // => 5
add(10)(11); // => 21
我们的加法函数输入x,返回了一个输入y返回值是y + x的函数。那我们应该如何用箭头函数表达这个函数呢?已知...
- 箭头函数定义是一个表达式,并且
- 箭头函数隐式返回单一表达式结果
那么我们所要做的就是让另一个箭头函数作为我们箭头函数的函数体,因此表达方式如下:
const add = x => y => y + x;
// outer function: x => [inner function, uses x]
// inner function: y => y + x;
现在我们就可以通过一个与变量x相关的返回值创建内部函数:
const add2 = add(2);// returns [inner function] where x = 2
add2(4); // returns 6: exec inner with y = 4, x = 2
add(8)(7); // 15
我们所写的加法函数并不是超级有用,但是它可以说明一个外函数如何输入一个以x为变量的参数函数,并在它返回的函数中引用此函数。
##用户分类
假如你在github上看到了一个ES6代码库,并且遇到了下面这样的代码:
const has = p => o => o.hasOwnProperty(p);
const sortBy = p => (a, b) => a[p] > b[p];let result;
let users = [{ name: 'Qian', age: 27, pets : ['Bao'], title : 'Consultant' },{ name: 'Zeynep', age: 19, pets : ['Civelek', 'Muazzam'] },{ name: 'Yael', age: 52, title : 'VP of Engineering'}
];result = users.filter(has('pets')).sort(sortBy('age'));
这些代码又是什么意思?我们叫它箭头原型的排列和滤波方法,每一种方法都使用一个单功能参数,但是我们会调用返回函数的函数来筛选和排序,而不是编写表达式去做这些。
让我们来看一看,在下列每种情况下返回函数的表达方式。
###无高阶函数:
result = users.filter(x => x.hasOwnProperty('pets')) //pass Function to filter.sort((a, b) => a.age > b.age); //pass Function to sort
###有高阶函数:
result = users.filter(has('pets')) //pass Function to filter.sort(sortBy('age')); //pass Function to sort
在每个实例中,过滤过程都是通过检查对象是否含有名为“pets”的属性值的函数执行的。
##为什么它是有用的?
它的有效性出于以下几个原因:
- 它减少了重复代码
- 它简化了代码的可重用性
- 它提升了代码含义的清晰度
想象一下我们只想过滤出有宠物和有职位的用户,我们可以在其中添加另一个函数:
result = users.filter(x => x.hasOwnProperty('pets')).filter(x => x.hasOwnProperty('title'))...
这里的重复只是徒增杂乱:它的简明度没有提升,只是写了更多代码妨碍视线。下面是可实现同样功能的使用了has函数的代码:
result = users.filter(has('pets')).filter(has('title'))...
这段代码更加短小精悍且易于书写,还可以减少打错字的情况。笔者同时认为这段代码大大增加了阅读清晰度,一眼就能读出代码的含义。 至于函数重用性,如果需要在很多地方过滤出有宠物的用户或者有职位的用户,你可以创建如下函数,并按需重用:
const hasPets = has('pets');
const isEmployed = has('title');
const byAge = sortBy('age');let workers = users.filter(isEmployed);
let petOwningWorkers = workers.filter(hasPets);
let workersByAge = workers.sort(byAge);
我们也可以使用已给出的函数来获得单返回值,并不仅仅是用于过滤数组:
let user = {name: 'Assata', age: 68, title: 'VP of Operations'};
if(isEmployed(user)){ // true//do employee action
}
hasPets(user); // false
has('age')(user); //true
##更进一步
让我们来写一个能检查对象拥有一个有固定值的主键的过滤函数。has函数可检查主键,然而我们需要知道两项值(主键和键值),而不是一项,来同时检查值。下面请看一种方法:
//[p]roperty, [v]alue, [o]bject:
const is = p => v => o => o.hasOwnProperty(p) && o[p] == v;// broken down:
// outer: p => [inner1 function, uses p]
// inner1: v => [inner2 function, uses p and v]
// inner2: o => o.hasOwnProperty(p) && o[p] = v;
此处,叫做“is”的函数可执行以下三件事:
- 取一个属性名并且返回一个函数,该函数……
- 取一个函数值返回一个函数,该函数……
- 取一个对象,并检测该对象是否有特定函数值的特定属性,最终返回一个布尔值。
下面是一个使用is函数来过滤用户的示例:
const titleIs = is('title');
// titleIs == v => o => o.hasOwnProperty('title') && o['title'] == v;const isContractor = titleIs('Contractor');
// isContractor == o => o.hasOwnProperty('contractor') && o['title'] == 'Contractor';let contractors = users.filter(isContractor);
let developers = users.filter(titleIs('Developer'));let user = {name: 'Viola', age: 50, title: 'Actress', pets: ['Zak']};
isEmployed(user); // true
isContractor(user); // false
##书写风格说明
看一眼下面这个函数,记下你弄清楚函数意义的时间:
const i = x => y => z => h(x)(y) && y[x] == z;
现在请再看一下同功能仅在书写风格中略微不同的函数:
const is = prop => val => obj => has(prop)(obj) && obj[prop] == val;
可见,书写一行越简洁越好的函数的编码趋势是以牺牲可读性为代价的。请克制自己这样做的冲动!简短却无意义的变量名的确看起来很漂亮,但是让人难以理解函数的功能。起一个包含多个词的有意义的变量名和函数名,其实是在帮你自己和同事理解函数功能。
##还有一件事...
如果你想以年龄降序排序而不是升序排列,该怎么做呢?或者说查找不是雇员的用户该怎么做呢?我们需要去写一个新的functionssortByDesc 或者notHas程序吗?当然不用!我们可以将已有的返回布尔值的函数封装起来,用一个反转其布尔值的函数来实现上述功能,反之亦然。
//take args, pass them thru to function x, invert the result of x
const invert = x => (...args) => !x(...args);
const noPets = invert(hasPets);let petlessUsersOldestFirst = users.filter(noPets).sort(invert(sortBy('age')));
##总结
函数式编程在编程界的势头越来越强劲,而ES6使得在JavaScript中采用这种编程思想更加容易。如果你在JavaScript编程过程中还没遇到过函数式编程风格的代码,你很可能在接下来的几个月里就能遇到。这意味着即便你不喜欢这种风格,理解它的基础知识也是非常重要的,有的知识在这里已经提到过了。希望这篇文章提出的概念能够帮你在实际遇到ES6代码时准备好前提知识,更希望它能鼓励你尝试这种编程风格!
OneAPM 助您轻松锁定 .NET 应用性能瓶颈,通过强大的 Trace 记录逐层分析,直至锁定行级问题代码。以用户角度展示系统响应速度,以地域和浏览器维度统计用户使用情况。想技术文章,请访问 OneAPM 官方博客。 本文转自 OneAPM 官方博客 原文链接:https://strongloop.com/strongblog/higher-order-functions-in-es6easy-as-a-b-c/
转载于:https://my.oschina.net/oneapmofficial/blog/657271
ES6中的高阶函数:如同 a = b = c 一样简单相关推荐
- python中的高阶函数
python中的高阶函数 文章目录: 1 什么是高阶函数? 1.1 高阶函数:一个函数的`函数名`作为参数传给另外一个函数 1.2 高阶函数:一个函数返回值(return)为另外一个`函数` 2 py ...
- 【Kotlin】Kotlin 语言集合中的高阶函数详解 ( 数据类 data class | maxBy | minBy | filter | map | any | count | find )
文章目录 I . List 集合高阶函数引入 II . Kotlin 数据类 ( data class ) III . Java 代码 与 Kotlin 代码实现对比 ( 查询年龄最大的 ) IV . ...
- Kotlin中的高阶函数
博客地址sguotao.top/Kotlin-2018- 在Kotlin中,高阶函数是指将一个函数作为另一个函数的参数或者返回值.如果用f(x).g(x)用来表示两个函数,那么高阶函数可以表示为f(g ...
- 16、react 中的高阶函数和柯里化
react 中的高阶函数和柯里化 这一篇博文我们说一下 高阶函数 和 柯里化,这两个次可能第一次听说,不知道是啥意思,我们先不管他哈,记得上一篇博客,我们实现了一个登陆的案例是吧?输入用户名和密码,点 ...
- scala中的高阶函数_Scala中的高阶函数(HOF)
scala中的高阶函数 Higher Order Functions (HOF) in Scala are the very core of this functional programming l ...
- Swift 中的高阶函数
一.概念 高阶函数是将一个或多个函数作为参数或返回一个函数作为其结果的函数 二.Swift的集合类型中的高阶函数 1.Map 对于原始集合里的每一个元素,以一个变换后的元素替换之形成一个新的集合 le ...
- 1 access中iif函数中的_JavaScript中的高阶函数
前言 在 JavaScript 的学习过程中,我们可能或多或少地接触过高阶函数.那么,我们自己对此是否有一个明确的定义,或者说很熟练的掌握这些用法呢 如果文章中有出现纰漏.错误之处,还请看到的小伙伴多 ...
- python什么是高阶函数_说说 Python 中的高阶函数
高阶函数(higher-order function)指的是:接受一个函数为参数,或者把函数作为结果值返回的函数1. 1 sorted() 比较常见的高阶函数是 sorted(),其内部的关键字参数 ...
- 什么是高阶函数?数组中的高阶函数有哪些?
何为高阶函数?一个函数就可以接收另一个函数作为参数或者返回值为一个函数,这种函数就称之为高阶函数. 1. Map 遍历 1. 对原来的数组没有影响: 2. 创建一个新数组,其结果是该数组中的每个元素都 ...
最新文章
- 实现一个简单的编译器
- 声学漫谈之五:音腔是怎么影响声音效果的
- 60.Java 代码编译和执行的整个过程
- 你会在C#的类库中添加web service引用吗?
- centos7全离线安装docker1.17.12
- OSI模型 TCP/IP模型 数据包结构
- linux加一个2t硬盘吗,在linux下新增一块硬盘的操作。(包含大于2T的硬盘在linux下挂载操作)...
- [css] 用CSS画出一个任意角度的扇形,可以写多种实现的方法
- devops 开发_开发五年,DevOps手册问世
- linux连接oracle数据库中文显示乱码
- lnmp之PDO_mysql.so
- 【Shell脚本学习指南笔记】重定向文件描述符 21
- SpringBoot→请求参数、返回参数、文件上传、拦截器、异常处理、定时任务、异步任务
- 卷积的感受野计算及特征图尺寸计算
- Linux学习笔记11_系统操作、优化相关命令复习
- postgresql 数据库连接数查询
- 来自阿里十余年的老架构师自述:成为架构师你只差了一步
- Mac:was built for newer OSX version (10.15) than being linked (10.14)
- seo与sem的关系和区别
- 海康威视PC端循环录制监控