1、语法

arr.reduce(callback,[initialValue])

reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上一次回调函数的返回值),当前元素值,当前索引,调用 reduce 的数组。

callback (执行数组中每个值的函数,包含四个参数)

    1、previousValue (上一次调用回调返回的值,或者是提供的初始值(initialValue))
2、currentValue (数组中当前被处理的元素)
3、index (当前元素在数组中的索引)
4、array (调用 reduce 的数组) initialValue (作为第一次调用 callback 的第一个参数。)
去重:
function weight(arr) {
var hash = {};
arr = arr.reduce(function (item, next) {
hash[next.id] ? '' : hash[next.id] = true && item.push(next);
return item
}, []);
return arr;
}

reduce的高级用法

(1)计算数组中每个元素出现的次数

let names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];

let nameNum = names.reduce((pre,cur)=>{
if(cur in pre){
pre[cur]++
}else{
pre[cur] = 1
}
return pre
},{})
console.log(nameNum); //{Alice: 2, Bob: 1, Tiff: 1, Bruce: 1}

(2)数组去重

let arr = [1,2,3,4,4,1]
let newArr = arr.reduce((pre,cur)=>{
if(!pre.includes(cur)){
return pre.concat(cur)
}else{
return pre
}
},[])
console.log(newArr);// [1, 2, 3, 4]

(3)将二维数组转化为一维

let arr = [[0, 1], [2, 3], [4, 5]]
let newArr = arr.reduce((pre,cur)=>{
return pre.concat(cur)
},[])
console.log(newArr); // [0, 1, 2, 3, 4, 5]

(3)将多维数组转化为一维

let arr = [[0, 1], [2, 3], [4,[5,6,7]]]
const newArr = function(arr){
return arr.reduce((pre,cur)=>pre.concat(Array.isArray(cur)?newArr(cur):cur),[])
}
console.log(newArr(arr)); //[0, 1, 2, 3, 4, 5, 6, 7]

(4)、对象里的属性求和

var result = [
{
subject: 'math',
score: 10
},
{
subject: 'chinese',
score: 20
},
{
subject: 'english',
score: 30
}
]; var sum = result.reduce(function(prev, cur) {
return cur.score + prev;
}, 0);
console.log(sum) //60

JS数组reduce()方法的更多相关文章

  1. JS进阶篇--JS数组reduce()方法详解及高级技巧

    基本概念 reduce() 方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值. reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被 ...

  2. js数组reduce()方法的使用和一些应用场景

    reduce()的使用 reduce()方法为归并类方法,最常见的应用场景就是,计算数组中每一项的总和. reduce()方法会遍历数组的每一项,它接收两个参数: 第一个参数是:每次遍历都会调用的函数 ...

  3. JS数组reduce()方法详解及高级技巧

    1.语法 arr.reduce(callback,[initialValue]) reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上 ...

  4. Js的reduce()方法

    Js 数组reduce()方法应用一个函数针对数组的两个值(从左到右),以减至一个值. 语法:array.reduce(callback[, initialValue]) 参数说明: 1)callba ...

  5. 浅谈6种JS数组遍历方法的区别

    本篇文章给大家介绍一下6种JS数组遍历方法:for.foreach.for in.for of.. each. ().each的区别.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. ...

  6. 再探JS数组原生方法—没想到你是这样的数组

    最近作死又去做了一遍javascript-puzzlers上的44道变态题,这些题号称"JS语言专业八级"的水准,建议可以去试试,这里我不去解析这44道题了, ...

  7. js数组的方法小结

    js中数组是一种非常常用数据结构,而且很容易模拟其他的一些数据结构,比如栈和队列.数组的原型Array.prototype内置了很多方法,下面就来小小总结一下这些方法. 检测数组就不用多说了,使用EC ...

  8. js数组遍历方法总结

    数组遍历方法 1.for循环 使用临时变量,将长度缓存起来,避免重复获取数组长度,当数组较大时优化效果才会比较明显. 1 2 3 for(j = 0,len=arr.length; j < le ...

  9. js数组push方法使用注意

    js 数组的push方法,想必大家都知道是向数组末尾添加元素,但是有一个很关键的点需注意: 引自MDN 返回值 当调用该方法时,新的 length 属性值将被返回. var sports = [&qu ...

随机推荐

  1. 在VM中安装Android4.4连接小米手机 之 安装小米手环APP

    1.下载APP 在能够上网的情况的,搜索 小米手环APP就能够找到下载地址 2.安装APP 进入终端 3.在终端按下图红色区域语句依次输入. 先进入超级用户 找到下载的APP所在的路径 然后进入该路径 ...

  2. 1159--Palindrome(dp:回文串变形2)

    Palindrome Time Limit: 3000MS   Memory Limit: 65536K Total Submissions: 53431   Accepted: 18454 Desc ...

  3. 对数据html文本 的处理

    对数据html文本 的处理  : 提取文字.图片.分句 ''' SELECT * FROM Info_Roles WHERE Flag=1 LIMIT 2; select top y * from 表 ...

  4. Timus 1146. Maximum Sum

    1146. Maximum Sum Time limit: 0.5 secondMemory limit: 64 MB Given a 2-dimensional array of positive ...

  5. adb 命令模拟按键事件 【转】

    本文转载自:http://blog.sina.com.cn/s/blog_68f262210102vc1b.html 转自:http://blog.csdn.net/jlminghui/article ...

  6. golang函数——可以为类型(包括内置数据类型)定义函数,类似类方法,同时支持多返回值

    不可或缺的函数,在Go中定义函数的方式如下: func (p myType ) funcName ( a, b int , c string ) ( r , s int ) { return } 通过 ...

  7. bzoj 1367 [ Baltic 2004 ] sequence —— 左偏树

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=1367 好题啊!论文上的题: 论文上只给出了不下降序列的求法: 先考虑特殊情况,如果原序列上升 ...

  8. 【转载】sql索引存储结构

    一.引言 对数据库索引的关注从未淡出我的们的讨论,那么数据库索引是什么样的?聚集索引与非聚集索引有什么不同?希望本文对各位同仁有一定的帮助.有不少存疑的地方,诚心希望各位不吝赐教指正,共同进步.[最近 ...

  9. Mechanize抓取数据【Ruby】

    创建: 2017/08/05 更新: 2018/01/08 修正: ele_inner_text -> ele.inner_text                           补充: ...

  10. codevs1557 热浪(堆优化dijkstra)

    1557 热浪  时间限制: 1 s  空间限制: 256000 KB  题目等级 : 钻石 Diamond 题解  查看运行结果     题目描述 Description 德克萨斯纯朴的民眾们这个夏 ...