基本用法

arr.reduce(function(prev,cur,index,arr){
...
}, init);或者arr.reduce(function(prev,cur,index,arr){
...
},);

arr 表示将要原数组;
prev 表示上一次调用回调时的返回值,或者初始值 init;
cur 表示当前正在处理的数组元素;
index 表示当前正在处理的数组元素的索引,若提供 init 值,则索引为0,否则索引为1;
init 表示初始值。

常用的参数只有两个:prevcur

实例:
1.数组求和,求乘积

var  arr = [1, 2, 3, 4];
var sum = arr.reduce((x,y)=>x+y)
var mul = arr.reduce((x,y)=>x*y)
console.log( sum ); //求和,10
console.log( mul ); //求乘积,24

2.计算数组中每个元素出现的次数

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}

3.数组去重

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]

4.将二维数组转化为一维

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]

5.将多维数组转化为一维

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]


6.对象里的属性求和

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进阶篇--JS数组reduce()方法详解及高级技巧 1

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

  3. js 数组 reduce() 方法

    概念 reduce() 方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值. MDN:https://developer.mozilla.org/zh-C ...

  4. js 数组遍历方法详解(map、filter、find、findIndex、reduce)

    目录 前言 map map是什么 map方法的结构及入参 语法糖 map一般不改变原数组 filter 说明 例子 find 和 findIndex 说明 例子 reduce 说明 例子 尾言 前言 ...

  5. JS数组去重方法记录

    js数组去重方法 1.遍历数组,建立新数组,利用indexOf判断是否存在于新数组中,不存在则push到新数组,最后返回新数组 代码如下(示 例): function getArray(ar) {va ...

  6. JS数组reduce的25个高级用法

    reduce作为ES5新增的常规数组方法之一,对比forEach .filter和map,在实际使用上好像有些被忽略,下面这篇文章主要给大家介绍了关于JS数组reduce你不得不知道的25个高级用法, ...

  7. 在js对象上绑定js数组原生方法

    在js对象上绑定js数组原生方法 在js对象上绑定数组方法会给当前对象添加一个lenght:0属性 例: var o = {}; [].pop.call(o) console.log(o)//返回结果 ...

  8. 比较完善的手写数组reduce方法

    手写数组reduce方法 看过其他的文章, 感觉他们实现的reduce方法不够完善, 分享一下自己写的比较完善的reduce方法, 如果错误的地方, 请留言给我 Array.prototype.new ...

  9. js数组查找方法 find() findIndex() - Kaiqisan

    js数组查找方法 find() findIndex() ヤッハロー.Kaiqisanすうう.一つふつうの学生プログラマである,今天继续讲讲数组查询方法,,这俩方法更加适合于数组. 没错,就是数组专用的 ...

最新文章

  1. 单片机 多机通讯c语言,单片机多机串口通信.doc
  2. js 中的break continue return
  3. Nginx 搭建图片缓存服务器-转
  4. [转]史上最全的CSS hack方式一览
  5. 刘挺 | 从知识图谱到事理图谱
  6. 基于zookeeper实现分布式配置中心(一)
  7. linux Tcpdump 抓包 win大小异常
  8. Win10电脑系统文件损坏怎么修复
  9. matlab libjli.so,error while loading shared libraries: libjli.so 问题解决
  10. 使用 IntelliTrace 调试应用程序
  11. poj 1222 EXTENDED LIGHTS OUT 高斯消元
  12. MySQL(12)-----多表查询(内连接和外连接)
  13. linux显卡驱动编译安装,联想Y470下CentOS 6.4 AMD显卡驱动编译安装与配置
  14. ATFX:美股持续走高,空头趋势或将终结?
  15. 十次方:服务器的1U、2U、U代表什么意思?
  16. 为开启VM虚拟化,关闭Win10的Hyper-V
  17. vue项目转换服务器端渲染,vue-server-renderer实现vue项目改造服务端渲染
  18. Graph控件绘制图形从左往右显示方法,默认是从右往左
  19. q某音乐API接口分析--获取vKey和Sign
  20. 国际知名营养品牌排行榜前十位

热门文章

  1. ssh-keygen 的 详解
  2. Java静态域与静态方法
  3. 微信“看一看“个性化推荐:排序篇
  4. Elasticsearch自定排序插件实现
  5. 自由还是霸权? TPP将撤销政府的数据主权
  6. pip install 安装报错:UnicodeEncodeError: 'ascii' codec can't encode characters in position XX的解决办法...
  7. Idris趋近发布1.0版
  8. 好用的工具---screen命令
  9. 多代理集群调度:可伸缩性和灵活性
  10. 修正mysqlcc在MySQL 5.0上常报的 Table 'xxx' doesn't exist 错误