ES6数组新特性解析(map,filter,forEach,reduce)
程序员文章站
2023-11-21 08:35:58
es6 数组新特性(map,filter,foreach,reduce)
map:原来数组有多少个,map 处理之后还是那么多个。参数:item,index,array
let ar...
es6 数组新特性(map,filter,foreach,reduce)
map:原来数组有多少个,map 处理之后还是那么多个。参数:item,index,array
let arr = [12,35,56,79,56]; let arr1 = arr.map(item => item%2 === 0 '偶' : '奇'); let arr2 = arr.map((item,index) => index + ':' + item); console.log(arr); // [ 12, 35, 56, 79, 56 ] console.log(arr1); // [ '偶', '奇', '偶', '奇', '偶' ] console.log(arr2); // [ '0:12', '1:35', '2:56', '3:79', '4:56' ]
filter: 过滤掉不符合条件的。参数:item,index,array
let arr = [12,75,56,79,56]; let arr1 = arr.filter(item => item>=60); console.log(arr); // [ 12, 75, 56, 79, 56 ] console.log(arr1); // [ 75, 79 ]
foreach: 遍历。仅仅只是循环用,无返回值,也不会改变原数组。 参数:item,index,array
let arr = [12,35,56,79,56]; let arr1 = arr.foreach(item => item+20); console.log(arr); // [12,35,56,79,56] console.log(arr1); // undefined
reduce: 汇总。下面代码中的 tmp 可以理解为前一个值。
let arr = [12,35,56,79,56]; let avg = arr.reduce((tmp,item,index) => { tmp += item; if(index === arr.length-1) tmp /= (index+1); return tmp; }) console.log(avg); // 47.6 也就是这五个数的平均值
关于 reduce 的参数,其实有五个,tmp,item,index,array,init。如果没有传入 init,初始值就会取数组的第一个值,并且内部调用时,index 从1开始。
let arr = [12,35,56,79,56]; let avg = arr.reduce((tmp,item,index,array) => { console.log(tmp,item,index,array); tmp += item; if(index === arr.length-1) { console.log('我要求平均数了'); tmp /= (index+1); } return tmp; }) console.log(avg); /* 12 35 1 [ 12, 35, 56, 79, 56 ] 47 56 2 [ 12, 35, 56, 79, 56 ] 103 79 3 [ 12, 35, 56, 79, 56 ] 182 56 4 [ 12, 35, 56, 79, 56 ] 我要求平均数了 47.6 */
如果传入了初始值 10000,index 就从0开始。tmp 的初始值也就是10000,结果自然也不同了。
let arr = [12,35,56,79,56]; let avg = arr.reduce((tmp,item,index,array) => { console.log(tmp,item,index,array); tmp += item; if(index === arr.length-1) { console.log('我要求平均数了'); tmp /= (index+1); } return tmp; }, 10000) console.log(avg); /* 10000 12 0 [ 12, 35, 56, 79, 56 ] 10012 35 1 [ 12, 35, 56, 79, 56 ] 10047 56 2 [ 12, 35, 56, 79, 56 ] 10103 79 3 [ 12, 35, 56, 79, 56 ] 10182 56 4 [ 12, 35, 56, 79, 56 ] 我要求平均数了 2047.6 */
推荐阅读
-
ES6数组新特性解析(map,filter,forEach,reduce)
-
js数组中的find(), findIndex(), filter(), forEach(), some(), every(), map(), reduce()方法的详解和应用实例
-
Array数组对象中的forEach、map、filter及reduce详析
-
我学到的一些(JavaScript中的map和filter、reduce方法;ES6新特性:箭头函数)
-
5个数组Array方法: indexOf、filter、forEach、map、reduce使用实例_javascript技巧
-
Array数组对象中的forEach、map、filter及reduce详析
-
js数组中的find(), findIndex(), filter(), forEach(), some(), every(), map(), reduce()方法的详解和应用实例
-
5个数组Array方法: indexOf、filter、forEach、map、reduce使用实例_javascript技巧