位置: IT常识 - 正文

在 js 中,reduce() 的详解 以及使用方法(js中reduce用法)

编辑:rootadmin
在 js 中,reduce() 的详解 以及使用方法 reduce():

推荐整理分享在 js 中,reduce() 的详解 以及使用方法(js中reduce用法),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:js中reduce用法,js reduce使用场景,jsreduce用法,js中的reduce,js中reduce用法,js reduce使用场景,js中reduce用法,js中reduce用法,内容如对您有帮助,希望把文章链接给更多的朋友!

reduce()方法为归并类方法,最常用的场景就是,计算数组中的每一项的总和。

reduce() 方法会遍历数组的每一项,他接收两个参数:

第一个参数:每次遍历都会调用的函数,而这个函数有接收四个参数,分别是:前一个值、当前项、项目的索引和数组对象,而这个函数的返回值,回传给下一次遍历时,执行的这个方法的第一个参数。

第二个参数:归并基础的初始值

我们看一下例子: reduce()怎么用?

let arr = [1,2,3,4,5] arr.reduce((prev,cur)=>{ return prev+cur })

上面的这段代码,是用来计算数组总和的,reduce()方法中,只传了第一个参数,也就是只传了一个函数,但第二个参数、初始值没有传,当第二个值没有传的时候,第一次循环,prev的值,默认为数组的第一项,而cur的值为数组的第二项,也就是第一次循环,会return 1+2,这个时候,第一次循环返回的结果回传给下一次循环中方法的第一个参数,也就是说、第二次循环方法中prev的值,是第一次循环方法返回的结果

let arr = [1,2,3,4,5]arr.reduce((prev,cur)=>{ return prev+cur},10)在 js 中,reduce() 的详解 以及使用方法(js中reduce用法)

我们传入一下第二个参数,第一个循环,prev的值为reduce的第二个参数,也就是"归并基础的初始值",而cur的值为数组的第一项,第一项循环会返回10+1

总结:

1.当reduce()方法的第二个值为空时,第一次循环方法中的第一个参数(prev)为数组的第一项值,第二个参数(cur)为数组的第二项值,反之,第一次循环方法中的第一个参数(prev)为reduce的第二个参数值,第二个参数(cur)为数值的第一项值。

2.reduce()方法的第一个参数,就是每次遍历都会执行的匿名函数,当前函数的返回值就会传给下一次执行函数的第一个值。也就是prev

reduce 应用场景:

1.数组里所有值的和

var arr = [0,1,2,3]; var value = arr.reduce((pre, cur) => { return pre + cur; }, 0); console.log(value);// 输出:6

2.累加数组中对象的值

var arr = [{ x: 1 }, { x: 2 }, { x: 3 }]; var value = arr.reduce((pre, cur) => { return pre + cur.x; }, 0); console.log(value);// 输出:6

3.将二维数组转为一维数组

var arr = [ [0, 1], [2, 3], [4, 5], ]; var value = arr.reduce((pre, cur) => { return pre.concat(cur); }, []); console.log(value); // 输出:[0, 1, 2, 3, 4, 5]

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

var arr = ["a", "b", "a", "c", "c", "c"]; var value = arr.reduce((pre, cur) => { if (cur in pre) { pre[cur]++; } else { pre[cur] = 1; } return pre; }, {}); console.log(value); // 输出:{a: 2, b: 1, c: 3}

5.按属性对object分类

var people = [ { name: "tom", age: 17, birthYear: 2021 }, { name: "tony", age: 21, birthYear: 2021 }, { name: "bob", age: 18, birthYear: 2020 }, { name: "bob", age: 18, birthYear: 2021 }, { name: "bob", age: 18, birthYear: 2019 }, ]; function groupBy(arr, property) { if (!Array.isArray(arr)) return []; return arr.reduce((pre, obj) => { var newObj = { [property]: obj[property], data: [obj], }; if (!pre.length) { return [newObj]; } for (let i = 0; i < pre.length; i++) { let item = pre[i]; if (item[property] === obj[property]) { item.data = [...item.data, obj]; return pre; } } return [...pre, newObj]; }, []); } var value = groupBy(people, "birthYear");

返回值:

 6.数组去重:

var arr = [1, 2, 3, 2, 2, 3, 5, null, null, 0, false, false, true]; var value = arr.reduce((pre, cur) => { return pre.includes(cur) ? pre : pre.concat(cur); }, []); console.log(value);//[1, 2, 3, 5, null, 0, false, true]
本文链接地址:https://www.jiuchutong.com/zhishi/298631.html 转载请保留说明!

上一篇:JavaScript -- Map对象及常用方法介绍(js map())

下一篇:权限管理实现的两种方式(详解)(权限管理实现的功能包括)

  • 华为p30pro屏幕抗摔吗(p30pro屏幕评测)

    华为p30pro屏幕抗摔吗(p30pro屏幕评测)

  • 美团袋鼠快跑15元红包使用规则(美团袋鼠快跑入口)

    美团袋鼠快跑15元红包使用规则(美团袋鼠快跑入口)

  • 钉钉视频会议怎么转换摄像头(钉钉视频会议怎么看回放)

    钉钉视频会议怎么转换摄像头(钉钉视频会议怎么看回放)

  • 快手看直播怎么关闭字幕(快手看直播怎么去掉字幕)

    快手看直播怎么关闭字幕(快手看直播怎么去掉字幕)

  • 抖音删除评论对方知道吗(抖音删除评论对号有影响吗)

    抖音删除评论对方知道吗(抖音删除评论对号有影响吗)

  • 微信群@所有人怎么不提示(微信群@所有人的消息怎么屏蔽)

    微信群@所有人怎么不提示(微信群@所有人的消息怎么屏蔽)

  • 从用户的观点看操作系统是(从用户的观点看,操作系统中引入文件系统)

    从用户的观点看操作系统是(从用户的观点看,操作系统中引入文件系统)

  • 微信变成黑底白字怎么办(微信变成黑底白字怎么恢复正常)

    微信变成黑底白字怎么办(微信变成黑底白字怎么恢复正常)

  • 手机8p是什么手机(手机说的8p是什么意思)

    手机8p是什么手机(手机说的8p是什么意思)

  • 手机屏幕裂开了可以用什么胶水粘(手机屏幕裂开了可以继续使用吗)

    手机屏幕裂开了可以用什么胶水粘(手机屏幕裂开了可以继续使用吗)

  • 云充吧可以跨市还吗(云充吧共享充电宝可以异地还吗)

    云充吧可以跨市还吗(云充吧共享充电宝可以异地还吗)

  • 怎么用万能钥匙知道别人家的密码(苹果怎么用万能钥匙)

    怎么用万能钥匙知道别人家的密码(苹果怎么用万能钥匙)

  • 88vip怎么取消续费(88vip怎么取消续订)

    88vip怎么取消续费(88vip怎么取消续订)

  • leave的过去式(leave的过去式怎么写)

    leave的过去式(leave的过去式怎么写)

  • 苹果6照片加载不出来(苹果照片加载不出来有个感叹号)

    苹果6照片加载不出来(苹果照片加载不出来有个感叹号)

  • 树叶贴画怎么保存塑封(树叶贴画怎么保鲜不干)

    树叶贴画怎么保存塑封(树叶贴画怎么保鲜不干)

  • 微博经常访问一直在吗(微博经常访问一个人有记录吗)

    微博经常访问一直在吗(微博经常访问一个人有记录吗)

  • 犀牛工具栏怎么设置(犀牛工具栏怎么恢复)

    犀牛工具栏怎么设置(犀牛工具栏怎么恢复)

  • huaweip30是什么操作系统(华为30pto)

    huaweip30是什么操作系统(华为30pto)

  • ps纹理素材怎么导入(ps纹理素材怎么换图层)

    ps纹理素材怎么导入(ps纹理素材怎么换图层)

  • 5g和4g有何不同(5g和4g的区别大吗)

    5g和4g有何不同(5g和4g的区别大吗)

  • win11系统摄像头打不开怎么办?win11摄像头无法打开解决方法(win11系统摄像头黑屏)

    win11系统摄像头打不开怎么办?win11摄像头无法打开解决方法(win11系统摄像头黑屏)

  • 任务栏变宽了怎么办?(任务栏变宽了怎么调回来win11)

    任务栏变宽了怎么办?(任务栏变宽了怎么调回来win11)

  • 多模态论文串讲笔记(多模态教学模式论文)

    多模态论文串讲笔记(多模态教学模式论文)

  • 税金及附加怎么来的
  • 出口退税中的免抵税额可以认为是交的税吗
  • 个税申报错了并且已经缴款怎么修改
  • 营业额和合同额的区别
  • 个人以不动产投资入股
  • 生产企业运费收入怎么处理?
  • 政府补助款提现流程
  • 银行定期存款取钱需要本人吗
  • 物业公司代收代付水电费会计分录
  • 出口退税未收汇已申报
  • 装卸收入的增值税税率是多少
  • 只有增值税进项怎么抵扣
  • 发票是不是都一样
  • 电子普通发票入账规则
  • 安装费发票开具3%税率国税需要备案吗?
  • 公积金抵扣个税上限
  • 开具红字增值税专用发票是什么意思
  • 个体户一个月开票30万怎么上税
  • 成本费用率偏低
  • 一般纳税人税控盘维护费会计分录
  • 完工产品定额直接材料费用
  • 境内公司购买境外公司服务 缴税
  • 递延资产摊销属于什么科目
  • 购买土地建房出售怎么做账
  • 资产评估溢价部分如何处理?
  • 以前年度多列的费用今年交回
  • 质量抽样检查
  • 去年管理费用多记账结账如何调账
  • 其他权益工具投资交易费用计入哪里
  • 使用u盘安装windows11步骤
  • 景点门票定价依据
  • 预收房屋租金
  • 土地出资是否涉及企业所得税
  • 限售股转让个人所得税退税
  • 教你一行代码
  • 若依框架前端改造
  • js防抖节流的区别和使用场景
  • php静态方法可以被继承吗
  • 长期待摊费用为负数怎么调整
  • 帝国cms移动端
  • 工会经费计算公式的例子
  • 企业购买的结构性存款怎样做账
  • 劳务报酬什么情况下可以退税
  • 织梦怎么建站
  • 全国通用机打销售票真伪
  • 更正申报会扣分吗
  • 租金收入怎样缴纳个税
  • sql语句中单引号是什么
  • mongodb如何查询数据
  • 固定资产清理费用对应科目
  • 个体工商户增值税怎么计算
  • 小规模纳税人工程款税率是多少
  • 简易计税差额抵扣
  • 带有折扣的增值税专用发票图片
  • 进项税转出怎么交税
  • 餐饮企业原材料采购描述错误的是
  • 物业管理单位收取的物业费征不征收增值税
  • 基本户打款个人怎么办
  • 进项税额转出可以在所得税前扣除吗
  • 收到的普通发票被对方作废
  • 如何理解现金折扣
  • mysql8.0免安装
  • Windows Vista和Windows 7对比
  • ubuntu下安装QT教程
  • 怎么使用mac打电话
  • linux统计代码行数过滤空行
  • 苹果MaC系统查找微信储存文件
  • win7 windows安全中心
  • 装win8.1
  • python模拟reversed功能
  • js原型继承和构造继承
  • androidtime
  • windows下安装python环境
  • 交互式shell是什么意思
  • js对象用法
  • jquery移动div
  • javascript零基础入门书籍
  • 细说javascript
  • js中面向对象编程
  • 办理授权税务事项有哪些
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设