位置: IT常识 - 正文

JS操作数组神器——reduce(求和、出现次数、去重、分类)(js数组菜鸟教程)

编辑:rootadmin
JS操作数组神器——reduce(求和、出现次数、去重、分类) 一、简介

推荐整理分享JS操作数组神器——reduce(求和、出现次数、去重、分类)(js数组菜鸟教程),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:js数组操作方法,js数组操作方法大全,js操作数组神器怎么用,js数组菜鸟教程,js操作数组有哪些方法,分别有什么用,js 操作数组,js数组操作方法大全,js 操作数组,内容如对您有帮助,希望把文章链接给更多的朋友!

reduce() 对数组每个元素执行一次由您提供的reduce函数(升序执行),将其结果汇总为单个返回值。

循环遍历能做的,reduce都可以做。比如数组根据元素某个属性求和、数组元素出现次数、数组去重、数组根据某个元素属性分类等等。

arr.reduce((prev, cur, index, arr) => { return prev + cur}, 0)

参数介绍

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

以下为有无 init 的区别 演示代码

console.log('-------有init---------')const arr = [1, 2, 3, 4, 5]const sum = arr.reduce((prev, cur, index, arr) => { console.log(prev, cur, index, arr) return prev + cur}, 0)console.log(arr, sum)console.log('-------无init---------')const arr2 = [1, 2, 3, 4, 5]const sum2 = arr.reduce((prev, cur, index, arr) => { console.log(prev, cur, index, arr) return prev + cur})console.log(arr2, sum2)

输出结果

-------有init---------0 1 0 [ 1, 2, 3, 4, 5 ]1 2 1 [ 1, 2, 3, 4, 5 ]3 3 2 [ 1, 2, 3, 4, 5 ]6 4 3 [ 1, 2, 3, 4, 5 ]10 5 4 [ 1, 2, 3, 4, 5 ][ 1, 2, 3, 4, 5 ] 15-------无init---------1 2 1 [ 1, 2, 3, 4, 5 ]3 3 2 [ 1, 2, 3, 4, 5 ]6 4 3 [ 1, 2, 3, 4, 5 ]10 5 4 [ 1, 2, 3, 4, 5 ][ 1, 2, 3, 4, 5 ] 15二、求和

假如我们想把对商品的价格进行求和 演示代码

// 根据数组对象某个属性求和const shopList = [ { id: 1, name: '苹果', isDeleted: false, num: 2, price: 5999 }, { id: 2, name: '小米', isDeleted: false, num: 1, price: 3999 }, { id: 3, name: '华为', isDeleted: true, num: 3, price: 4999 }]let shopListSum = shopList.reduce((prev, item) => { prev += item.num * item.price return prev}, 0)console.log(shopListSum)JS操作数组神器——reduce(求和、出现次数、去重、分类)(js数组菜鸟教程)

输出结果

30994三、出现次数

假如我们想计算每件商品的搜索次数 演示代码

// 计算数组元素次数const nameList = ['xiaomi', 'huawei', 'pingguo', 'xiaomi', 'huawei', 'huawei']let countedNameObj = nameList.reduce((prev, item) => { if (item in prev) { prev[item]++ } else { prev[item] = 1 } return prev}, {})console.log(countedNameObj)

输出结果

{ xiaomi: 2, huawei: 3, pingguo: 1 }四、去重

可分为直接去重和排序后去重

1.直接去重 演示代码

const nameList = ['xiaomi', 'huawei', 'pingguo', 'xiaomi', 'huawei', 'huawei']let newNameList = nameList.reduce((prev, item) => { if (prev.indexOf(item) === -1) { prev.push(item) } return prev}, [])console.log(newNameList)

输出结果

[ 'xiaomi', 'huawei', 'pingguo' ]

2.排序后去重 演示代码

const numList = [1, 4, 5, 5, 7, 5, 8, 1, 2, 3, 4, 5, 9, 1, 2]let newNumList = numList.sort().reduce((prev, item) => { if (prev.length === 0 || prev[prev.length - 1] !== item) { prev.push(item) } return prev}, [])console.log(newNumList)

输出结果

[1, 2, 3, 4, 5, 7, 8, 9]五、分类

假如我们想把商品数组里面上架和未上架的商品分类 演示代码

// 根据数组对象某个属性分类const shopList = [ { id: 1, name: '苹果', isDeleted: false }, { id: 2, name: '小米', isDeleted: false }, { id: 3, name: '华为', isDeleted: true }]function groupBy(list, pros) { return list.reduce((prev, item) => { let key = item[pros] if (!prev[key]) { prev[key] = [] } prev[key].push(item) return prev }, {})}let myShopList = groupBy(shopList, 'isDeleted')console.log(myShopList)

输出结果

{ false: [ { id: 1, name: '苹果', isDeleted: false }, { id: 2, name: '小米', isDeleted: false } ], true: [ { id: 3, name: '华为', isDeleted: true } ]}
本文链接地址:https://www.jiuchutong.com/zhishi/299678.html 转载请保留说明!

上一篇:做一个前端网页送给女朋友~轮播图+纪念日(前端作业做一个网站)

下一篇:web前端框架——Vue的特性(web前端框架是什么)

  • 抖音支持哪些视频格式(抖音支持哪些视频剪辑)

    抖音支持哪些视频格式(抖音支持哪些视频剪辑)

  • 抖音怎么设置别人不能下载我的作品(抖音怎么设置别人可以下载我的作品)

    抖音怎么设置别人不能下载我的作品(抖音怎么设置别人可以下载我的作品)

  • qq漫游聊天记录怎么恢复(qq漫游聊天记录删了怎么恢复找回来)

    qq漫游聊天记录怎么恢复(qq漫游聊天记录删了怎么恢复找回来)

  • 微信身份证审核需要多久(微信身份证审核不通过怎么办)

    微信身份证审核需要多久(微信身份证审核不通过怎么办)

  • 手机号实名认证不是自己的怎么办(手机号实名认证在哪里看)

    手机号实名认证不是自己的怎么办(手机号实名认证在哪里看)

  • 为什么qq昵称改了还是显示之前的(为什么QQ昵称改了下面列表还是改不了)

    为什么qq昵称改了还是显示之前的(为什么QQ昵称改了下面列表还是改不了)

  • 闲鱼拉黑对方还能评价吗(闲鱼拉黑对方还能评价商品吗)

    闲鱼拉黑对方还能评价吗(闲鱼拉黑对方还能评价商品吗)

  • 荣耀9xpro充电速度(荣耀9x充电效率)

    荣耀9xpro充电速度(荣耀9x充电效率)

  • vivox30有没有红外线(vivox30有红外感应吗)

    vivox30有没有红外线(vivox30有红外感应吗)

  • u盘安装win10缺少驱动(u盘安装win10缺少介质)

    u盘安装win10缺少驱动(u盘安装win10缺少介质)

  • ps怎么给图片描边(ps怎么给图片描虚线边外轮廓)

    ps怎么给图片描边(ps怎么给图片描虚线边外轮廓)

  • 微信屏蔽是什么意思(微信屏蔽是什么心理)

    微信屏蔽是什么意思(微信屏蔽是什么心理)

  • 手机怎样设置默认浏览器(手机怎样设置默认音乐播放器)

    手机怎样设置默认浏览器(手机怎样设置默认音乐播放器)

  • 哔咔漫画ios怎么下载(哔咔漫画ios怎么下载知乎)

    哔咔漫画ios怎么下载(哔咔漫画ios怎么下载知乎)

  • 手机上hd这么打开(hd怎么打)

    手机上hd这么打开(hd怎么打)

  • vivo来电闪光灯怎么开启(vivo来电闪光灯怎么打开)

    vivo来电闪光灯怎么开启(vivo来电闪光灯怎么打开)

  • 华为mate30pro几个卡槽(华为mate30pro几个喇叭)

    华为mate30pro几个卡槽(华为mate30pro几个喇叭)

  • 京东夜间模式在哪(京东夜间模式在哪里关闭)

    京东夜间模式在哪(京东夜间模式在哪里关闭)

  • iphone11有没有nfc功能(iPhone11有没有红外线遥控功能)

    iphone11有没有nfc功能(iPhone11有没有红外线遥控功能)

  • 小米如何设置熄屏钟表(小米如何设置熄灭屏幕)

    小米如何设置熄屏钟表(小米如何设置熄灭屏幕)

  • 关机来电提醒怎么设置(关机来电提醒怎么开通)

    关机来电提醒怎么设置(关机来电提醒怎么开通)

  • oppoa59s电池容量(oppoa59手机电池容量)

    oppoa59s电池容量(oppoa59手机电池容量)

  • 小米怎么查是不是新手机(小米怎么查是不是全新未拆封的)

    小米怎么查是不是新手机(小米怎么查是不是全新未拆封的)

  • 全国增值税发票查询平台 手机版
  • 计提印花税会计
  • 企业实收资本与股本区别
  • 成本票和进项票怎么区分
  • 月初领票后还能作废申报吗
  • 现金流量表年报中的上年金额是什么
  • 管理费用怎么结转成本
  • 收到发票未付款怎么处理
  • 物流辅助服务印花税税率
  • 商贸企业加工费包括哪些
  • 企业间的合作
  • 农产品增值税抵扣新政策2021
  • 预计销售退回的钱怎么算
  • 原材料没发票能结转成本吗?
  • 公司出差是自己先垫付再报账吗
  • 库存现金限额一般由开户银行根据企业
  • 公司产品中请别人开发的软件怎么会计处理?
  • 返利失效了怎么找回
  • 应付票据与应付账款
  • 营改增开票规定
  • 如何查发票真伪发票查询
  • 进口采购交的增值税
  • 外币账户利息结汇
  • 建筑公司异地预缴增值税
  • 转出以前年度成本怎么做账
  • mac怎么打出@符号
  • 怎么授权gg修改器root权限
  • 苹果电脑mac设备在哪里
  • 主营业务成本净额计算公式
  • 工业废弃物处理方式
  • 往年亏损,今年盈利,是否计提盈余公积
  • 信息技术费用如何做分录
  • 工业企业生产成本核算表
  • 电脑任务栏消失怎么把它显示出来
  • cvpr2020结果
  • laravel框架实现增删改查
  • 小额贷款企业收利息吗
  • 企业发生的现金折扣应计入什么费用
  • 关于 ChatGPT 必看的 10 篇论文
  • 背景渐变 css
  • 深度学习如何训练出好的模型
  • laravel event
  • 商贸企业发生退税的原因
  • 顺风车没有发票可以税前扣除吗
  • 开票金额应该含增值税吗
  • 发票无法收回会计分录
  • 账龄划分中有借有贷怎么分析
  • 出差自己开车去开会怎么报销交通费
  • 企业筹建期间可以上市吗
  • 印花税计入税金及附加科目吗
  • 小规模纳税人免税政策2022
  • 商贸公司经营范围可以写烟酒吗
  • 专票红冲信息表填开显示红字信息表金额大于蓝色金额
  • 应付利息属于什么负债
  • 发放职工薪酬的记账凭证
  • 法院强制执行扣完款就完事了吗
  • 公司软件使用制度
  • 本年利润的年末余额
  • 境外机构境内外汇账户管理办法
  • sql数据库监控工具
  • 最全的免费追漫软件
  • 怎样让windows media player播放mkv文件
  • xp系统怎么取消自动关机
  • 微软surface pro 3按键驱动
  • linux删除大量文件方法
  • centos怎么备份
  • WinCtlAdAlt.exe - WinCtlAdAlt是什么进程
  • windows中的服务
  • centos7 lvs
  • 电脑kernel32.dll
  • redhat linux yum
  • win8.1如何更新到win10
  • jsp验证邮箱格式
  • z-blog SyntaxHighlighter 长代码无法换行解决办法(基于jquery)
  • js制作网站
  • 医保报销是按自然年计算吗
  • 重庆路桥价值
  • 辽宁省大连市地震
  • 浙江欧派和广东欧派哪个好
  • 税务稽查机构
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设