JavaScript 高阶函数
高阶函数的英文叫Higher-order function ,什么是高阶函数呢>?
JavaScript的函数其实都指向某个变量。既然变量可以指向函数,函数的参数能接收变量,那么一个函数就可以接收另一个函数作为参数,这种函数就称之为高阶函数。
一个最简单的高阶函数: function add(x, y, f) {
return f(x) + f(y);
}
用代码验证一下:
add(-5, 6, Math.abs); // 11
map/reduce
举例说明,比如我们有一个函数f(x)=x2,要把这个函数作用在一个数组[1, 2, 3, 4, 5, 6, 7, 8, 9]
上,就可以用map
实现如下:
function pow(x) {
return x * x;
} var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
arr.map(pow); // [1, 4, 9, 16, 25, 36, 49, 64, 81]
educe
再看reduce的用法。Array的reduce()
把一个函数作用在这个Array
的[x1, x2, x3...]
上,这个函数必须接收两个参数,reduce()
把结果继续和序列的下一个元素做累积计算,其效果就是:
比方说对一个Array求和,就可以用reduce实现: var arr = [1, 3, 5, 7, 9];
arr.reduce(function (x, y) {
return x + y;
}); // 25
filter也是一个常用的操作,它用于把Array的某些元素过滤掉,然后返回剩下的元素。 和map()类似,Array的filter()也接收一个函数。和map()不同的是,filter()把传入的函数依次作用于每个元素,然后根据返回值是true还是false决定保留还是丢弃该元素。 例如,在一个Array中,删掉偶数,只保留奇数,可以这么写: var arr = [1, 2, 4, 5, 6, 9, 10, 15];
var r = arr.filter(function (x) {
return x % 2 !== 0;
});
r; // [1, 5, 9, 15]
把一个Array中的空字符串删掉,可以这么写: var arr = ['A', '', 'B', null, undefined, 'C', ' '];
var r = arr.filter(function (s) {
return s && s.trim(); // 注意:IE9以下的版本没有trim()方法
});
r; // ['A', 'B', 'C']
可见用filter()这个高阶函数,关键在于正确实现一个“筛选”函数。
var arr = ['A', 'B', 'C'];
var r = arr.filter(function (element, index, self) {
console.log(element); // 依次打印'A', 'B', 'C'
console.log(index); // 依次打印0, 1, 2
console.log(self); // self就是变量arr
return true;
});
利用filter,可以巧妙地去除Array的重复元素
去除重复元素依靠的是indexOf
总是返回第一个元素的位置,后续的重复元素位置与indexOf
返回的位置不相等,因此被filter
滤掉了。
简单总结:
map 对数组里的每一个对象应用函数
arr.map(fun())
reduce 对数组的每两两计算结果.通常用于求和
fun (x,y){
return x*y;
}
arr.map(fun)
filter(foo) 过滤一些不符合条件的数值
JavaScript 高阶函数的更多相关文章
- JavaScript高阶函数之filter、map、reduce
JavaScript高阶函数 filter(过滤) 用法: 用于过滤,就是把数组中的每个元素,使用回调函数func进行校验,回调函数func返回一个布尔值,将返回值为 true 的元素放入新数组 参数 ...
- JavaScript高阶函数
所谓高阶函数(higher-order function) 就是操作函数的函数,它接收一个或多个函数作为参数,并返回一个新函数. 下面的例子接收两个函数f()和g(),并返回一个新的函数用以计算f(g ...
- JavaScript高阶函数 map reduce filter sort
本文是笔者在看廖雪峰老师JavaScript教程时的个人总结 高阶函数 一个函数就接收另一个函数作为参数,这种函数就称之为高阶函数 1.高阶函数之map: ...
- JavaScript高阶函数的应用
定义 高阶函数是指至少满足下列条件之一的函数: 函数可以作为参数被传递: 函数可以作为返回值输出. JavaScript语言中的函数显然满足高阶函数的条件,在实际开发中,无论是将函数当作参数传递,还是 ...
- JavaScript 高阶函数 + generator生成器
map/reduce map()方法定义在JavaScript的Array中,我们调用Array的map()方法,传入我们自己的函数,就得到了一个新的Array作为结果: function pow(x ...
- 浅析javascript高阶函数
什么是高阶函数:在数学和计算机科学中,高阶函数是至少满足下列一个条件的函数: 1. 接受一个或多个函数作为输入: 2. 输出一个函数.在数学中它们也叫做算子(运算符)或泛函.微积分中的导数就是常见的例 ...
- JavaScript高阶函数map/reduce、filter和sort
map() 举例说明,比如我们有一个函数f(x)=x²,要把这个函数作用在一个数组[1,2,3,4,5,6,7,8,9]上. 由于map()方法定义在JavaScript的Array中,我们调用Arr ...
- JavaScript高阶函数(Heigher-order function)
概念 <javascript设计模式和开发实践>中定义 函数既可作为参数被传递,也可以作为返回值输出 满足以下条件: 接受一个或多个函数作为输入 输出一个函数 高阶函数一般是那些函数型包含 ...
- Javascript 高阶函数等
高阶函数 函数可以接受另一个函数作为参数 称为 高阶函数. map : arr.map(pow); 数组.map(函数); reduce :arr.reduce(function(){ }); 数组. ...
随机推荐
- problem:浏览器如何区分html超文本和普通文本
运营同学问:后端返回的一串元素标签,我想在网页中显示的时候,将标签中的内容渲染出来,不希望直接显示标签. 回答:bootstrap加模版组织的网页,模版渲染的数据只能渲染字符串,不能转化富文本. 运营 ...
- python3学习笔记六(元组)
元组 创建空元组 tup1 = () #空元组print(type(tup1))print(tup1) tup2 = (10)tup3 = (10,)print(type(tup2)) #不加逗号,类 ...
- (转载)o(1), o(n), o(logn), o(nlogn) 时间复杂度
o(1), o(n), o(logn), o(nlogn) 时间复杂度的解释: https://blog.csdn.net/yhc166188/article/details/81162865 时间复 ...
- 20145319 《网络渗透》MS08_067安全漏洞
20145319 <网络渗透>MS08_067安全漏洞 一 实验内容 了解掌握metasploit平台的一些基本操作,能学会利用已知信息完成简单的渗透操作 了解漏洞MS08_067的相关知 ...
- html 之 <meta> 标签之http-equiv
语法规则: <meta http-equiv=“参数” content=“参数值” > 1.X-UA-Compatible 文档兼容模式的定义 <meta http-equiv=“X ...
- mkimage command not found – U-Boot images will not be built
ubuntu 14.04 64位系统编译Linux kernel时提示: “mkimage” command not found – U-Boot images will not be built 按 ...
- EL(Expression Language)和JSTL标签(JSP Standard Tag Library)
一.EL表达式: Expression Language提供了在 JSP 脚本编制元素范围外(例如:脚本标签)使用运行时表达式的功能.脚本编制元素是指页面中能够用于在JSP 文件中嵌入 Java代码的 ...
- Codeforces Round #551 (Div. 2) A-E
A. Serval and Bus 算出每辆车会在什么时候上车, 取min即可 #include<cstdio> #include<algorithm> #include< ...
- JVM 垃圾回收GC Roots Tracing
1.跟搜索算法: JVM中对内存进行回收时,需要判断对象是否仍在使用中,可以通过GC Roots Tracing辨别. 定义: 通过一系列名为”GCRoots”的对象作为起始点,从这个节点向下搜索,搜 ...
- Vue Loader
介绍 允许为 Vue 组件的每个部分使用其它的 webpack loader,例如在 <style> 的部分使用 Sass 和在 <template> 的部分使用 Pug(模板 ...