1. map

map 函数接收一个回调函数作为参数，然后返回一个数组，这个数组中的每个元素都是调用回调函数后返回的结果。如：

function pow(x) {return x * x;
}
var arr = [1, 2, 3, 4, 5];
var results = arr.map(pow);
console.log(results);   // [1, 4, 9, 16, 25]

其中，这个回调函数 callback 接收三个参数：

function callback(currentValue[, index[, array]])

index 是元素的索引
array 是调用 map 函数的数组。
一般我们只使用第一个参数，后两个参数可选。

以下是调用三个参数的例子：

function show(x,i,arr) {console.log('x:' + x + ' i:' + i + ' arr:' + arr);
}
var arr = [1, 2, 3, 4, 5];
arr.map(show);
/*x:1 i:0 arr:1,2,3,4,5x:2 i:1 arr:1,2,3,4,5x:3 i:2 arr:1,2,3,4,5x:4 i:3 arr:1,2,3,4,5x:5 i:4 arr:1,2,3,4,5*/

因此在调用 map 函数的时候要注意回调函数的参数：

var arr = ['1', '2', '3'];
var r;
r = arr.map(parseInt);console.log(r);  //1,NaN,NaN

如这段代码本意是想将 arr 中的值转为 number 类型，不过由于parseInt(string, radix)没有忽略第二个参数，导致实际执行的函数分别是：

parseInt('1', 0); // 1, 按十进制转换parseInt('2', 1); // NaN, 没有一进制parseInt('3', 2); // NaN, 按二进制转换不允许出现 3

可以改为r = arr.map(Number);，因为Number(value)函数仅接收一个参数。

一个例子：

下面的代码将一个字符串数组的首字母改为大写，其他改为小写：

function normalize(arr) {return arr.map(function(s){return s[0].toUpperCase() + s.slice(1).toLowerCase();});}normalize(['adam', 'LISA', 'barT']);  // ['Adam', 'Lisa', 'Bart']

2. reduce

Array的reduce()把一个函数作用在这个Array的[x1, x2, x3...]上，这个函数必须接收两个参数，reduce()把结果继续和序列的下一个元素做累积计算，其效果就是：

[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)

比方说对一个Array求和，就可以用reduce实现：

var arr = [1, 3, 5, 7, 9];
arr.reduce(function (x, y) {return x + y;
}); // 25

一个例子：
使用 map 和 reduce 把一个字符串变为整数：
如'12345' 变为 12345

function string2int(s) {let arr = s.split('');arr = arr.map(function(x){return (x*1);});return arr.reduce(function(x,y){return x * 10 + y;});
}

上面的代码中，先将字符串 s 转为字符数组，再将字符数组转为整数。

3. filter

filter也是一个常用的操作，它用于把Array的某些元素过滤掉，然后返回剩下的元素。

和map()类似，Array的filter()也接收一个函数。和map()不同的是，filter()把传入的函数依次作用于每个元素，然后根据返回值是true还是false决定保留还是丢弃该元素（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]

filter()接收的回调函数，其实可以有多个参数。通常我们仅使用第一个参数，表示Array的某个元素。回调函数还可以接收另外两个参数，表示元素的位置和数组本身(和 map 一样)：

var arr = ['A', 'B', 'C'];
var r = arr.filter(function (element, index, self) {console.log(element); // 依次打印'A', 'B', 'C'console.log(index); // 依次打印0, 1, 2console.log(self); // self就是变量arrreturn true;
});

利用filter，可以巧妙地去除Array的重复元素：

r = arr.filter(function (element, index, self) {return self.indexOf(element) === index;
});

内容参考：
https://www.liaoxuefeng.com/wiki/1022910821149312

Array.prototype.map() 、 Array.prototype.reduce()、Array.prototype.filter()相关推荐

array.prototype.map（）如何工作
by Pradeep Pothineni 通过Pradeep Pothineni array.prototype.map()如何工作 (How array.prototype.map() works) ...
JS Array.reduce 实现 Array.map 和 Array.filter
继上一篇 Array.prototype.reduce 后,我立志要好好学习.琢磨了很久,再加上最近看了几篇"JS 函数式编程"的文章和书籍后,然后有感而发写下了这篇文章. Arr ...
js中数组过滤、遍历、迭代every、some、filter、map、forEach、reduce、reduceRight
全栈工程师开发手册 (作者:栾鹏) js系列教程1-数组操作全解 js中数组过滤.遍历.迭代数组的过滤.遍历.迭代操作中 1.过滤为将满足条件的元素筛选出来,返回数组 2.遍历为分别计算每一个元素值 ...
Python基础知识——函数的基本使用、函数的参数、名称空间与作用域、函数对象与闭包、装饰器、迭代器、生成器与yield、函数递归、面向过程与函数式（map、reduce、filter）
文章目录 1 函数的基本使用一引入二定义函数三调用函数与函数返回值 2 函数的参数一形参与实参介绍二形参与实参的具体使用 2.1 位置参数 2.2 关键字参数 2.3 默认参数 2 ...
4、js数组方法Map、fileter、reduce、sort
要点 filter 过滤操作,有点像 SQL 里面的 select 语句.筛出运行结果是 true 的组成数组返回. const __fifteen = inventors.filter(functi ...
js数组中filter、map、reduce、find等方法实现的原理
filter用法和原理实现 filter 过滤,filter()使用指定的函数测试所有元素,并创建一个包含所有通过测试的元素的新数组. let arr=[2,4,6,8]; let arr1=arr. ...
Python中lambda详解（包括内置函数map、reduce、filter、sorted、max）
文章目录一.lambda是什么? 1.lambda语法 2.语法详解二.lambda的使用 1.定义 2.调用 3.替换 4.作返回值三.lambda作参数 1.map函数 2.reduce函数 ...
python函数+定义+调用+多返回值+匿名函数+lambda+高级函数（reduce、map、filter）
python函数+定义+调用+多返回值+匿名函数+lambda+高级函数(reduce.map.filter) Python 中函数的应用非常广泛,比如 input() .print().range( ...
Python一些特殊用法(map、reduce、filter、lambda、列表推导式等)
Map函数: 原型:map(function, sequence),作用是将一个列表映射到另一个列表, 使用方法: def f(x): return x**2 l = range(1,10) map( ...
Python的函数名作为参数传入调用以及map、reduce、filter
零.python的lambda函数: 1 #lambda function 2 func = lambda x : x+1 3 #这里是一个匿名函数,x是参数,x+1是对参数的操作 4 func(1) ...

Array.prototype.map() 、 Array.prototype.reduce()、Array.prototype.filter()

文章目录

1. map

2. reduce

3. filter

Array.prototype.map() 、 Array.prototype.reduce()、Array.prototype.filter()相关推荐

最新文章

热门文章