IMAGINE'S BLOG IMAGINE'S BLOG
首页
  • 原生JS

    • JavaScript
  • 前端框架扩展

    • Vue
    • React
    • UI组件库
  • HTML
  • CSS
  • 浏览器
  • 分类
  • 标签
  • 归档
  • 技术文档
  • GitHub相关
  • Nodejs
关于
  • 网站
  • 友情链接
GitHub (opens new window)

peng

平平无奇的web前端开发一枚
首页
  • 原生JS

    • JavaScript
  • 前端框架扩展

    • Vue
    • React
    • UI组件库
  • HTML
  • CSS
  • 浏览器
  • 分类
  • 标签
  • 归档
  • 技术文档
  • GitHub相关
  • Nodejs
关于
  • 网站
  • 友情链接
GitHub (opens new window)
  • JavaScript

    • javascript 之 this 指向问题
    • JS循环遍历方法
    • 前端常用公共方法工具类
    • JS声明提升
    • JS合并数组对象中key值相同的数据
    • 数组对象求和
      • 利用 reduce()和 Object.keys()
    • 前端路由实现
    • Promise(一):Promise 认识
    • Promise(二):手动实现一个 Promise
    • Promise(三):拓展方法实现
    • JS forEach踩坑
    • ES6-ES12 特性
    • async/await
    • JavaScript 数组去重
    • js对象排序
    • js if/else 语句优化策略
    • js深拷贝
    • 正则表达式校验
    • js笛卡尔积
    • Axios 封装
  • 框架扩展

  • 前端乱炖
  • JavaScript
peng
2022-09-02
目录

数组对象求和

数组对象求和问题,在项目中有时会遇到列表求和的情况,这里记录一下。

let list = [
  { id: 1, value1: 5, value2: 10, value3: 20 },
  { id: 2, value1: 15, value2: 10, value3: 50 },
  { id: 3, value1: 40, value2: 20, value3: 20 },
];
1
2
3
4
5

# 利用 reduce()和 Object.keys()

function mergeArr(arr, data) {
  let result = arr.reduce((acc, cur) => {
    Object.keys(acc).forEach((item) => (acc[item] += cur[item]));
    return acc;
  }, data);

  return result;
}

const data = { value1: 0, value2: 0, value3: 0 };
mergeArr(list, data); // {value1: 60, value2: 40, value3: 90}
1
2
3
4
5
6
7
8
9
10
11
#JavaScript
上次更新: 2022/09/06, 10:30:04
JS合并数组对象中key值相同的数据
前端路由实现

← JS合并数组对象中key值相同的数据 前端路由实现→

最近更新
01
Axios 封装
09-06
02
MySQL数据库常用操作
09-06
03
解决element表格数据量过大导致页面渲染缓慢、卡顿问题
09-06
更多文章>
Theme by Vdoing | Copyright © 2020-2024 peng | IMAGINE
image | imgloc.com
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式