JS数组实现分类统计实例代码


Posted in Javascript onSeptember 30, 2018

将水果数组中同类的水果合并为一条并求出总数

var fruits = 
[{
  name: 'apple',
  value: 1
}, 
{
  name: 'apple',
  value: 2
}, // 总计3个苹果
{
  name: 'banana',
  value: 2
}, 
{
  name: 'banana',
  value: 3
}]; // 总计5个香蕉

var fruitTotal = []; // 存最终数据结果

// 数据按照水果名称进行归类
var nameContainer = {}; // 针对键name进行归类的容器
fruits.forEach(item => {
  nameContainer[item.name] = nameContainer[item.name] || [];
  nameContainer[item.name].push(item);
});

console.log(nameContainer); // 按照水果名称归类完成:{ apple: Array(2), banana: Array(2) }

// 统计不同种类水果的数量
var fruitName = Object.keys(nameContainer); // 获取水果种类:["apple", "banana"]
fruitName.forEach(nameItem => {
  let count = 0;
  nameContainer[nameItem].forEach(item => {
    count += item.value; // 遍历每种水果中包含的条目计算总数
  });
  fruitTotal.push({'name': nameItem, 'total': count});
});

console.log(fruitTotal);
// 输出结果:
// [{ name: "apple", total: 3 },
// { name: "banana", total: 5 }]

总结

以上所述是小编给大家介绍的JS数组实现分类统计实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
非常棒的10款jQuery 幻灯片插件
Jun 14 Javascript
js自定义事件及事件交互原理概述(二)
Feb 01 Javascript
js如何调用qq互联api实现第三方登录
Mar 28 Javascript
escape函数解决js中ajax传递中文出现乱码问题
Oct 30 Javascript
javascript框架设计读书笔记之数组的扩展与修复
Dec 02 Javascript
JavaScript中eval()函数用法详解
Dec 14 Javascript
JavaScript实现自动切换图片代码
Oct 11 Javascript
javascript中json基础知识详解
Jan 19 Javascript
使用clipboard.js实现复制功能的示例代码
Oct 16 Javascript
Node.js模块全局安装路径配置方法
May 17 Javascript
迅速了解一下ES10中Object.fromEntries的用法使用
Mar 05 Javascript
JavaScript设计模型Iterator实例解析
Jan 22 Javascript
浅谈微信页面入口文件被缓存解决方案
Sep 29 #Javascript
vue实现弹框遮罩点击其他区域弹框关闭及v-if与v-show的区别介绍
Sep 29 #Javascript
vue使用v-for实现hover点击效果
Sep 29 #Javascript
vue 利用路由守卫判断是否登录的方法
Sep 29 #Javascript
vue路由事件beforeRouteLeave及组件内定时器的清除方法
Sep 29 #Javascript
在vue中v-bind使用三目运算符绑定class的实例
Sep 29 #Javascript
iview同时验证多个表单问题总结
Sep 29 #Javascript
You might like
PHP 基本语法格式
2009/12/15 PHP
深入密码加salt原理的分析
2013/06/06 PHP
Array.slice()与Array.splice()的返回值类型
2006/10/09 Javascript
JavaScript修改css样式style
2008/04/15 Javascript
jQuery Ajax方法调用 Asp.Net WebService 的详细实例代码
2011/04/27 Javascript
jQuery使用数组编写图片无缝向左滚动
2012/12/11 Javascript
Jquery解析json数据详解
2013/12/26 Javascript
不使用jquery实现js打字效果示例分享
2014/01/19 Javascript
js 获取、清空input type="file"的值示例代码
2014/02/19 Javascript
jQuery自动添加表单项的方法
2015/07/13 Javascript
React创建组件的三种方式及其区别
2017/01/12 Javascript
vue实现简单实时汇率计算功能
2017/01/15 Javascript
javascript自执行函数
2017/02/10 Javascript
vue2.0 根据状态值进行样式的改变展示方法
2018/03/13 Javascript
JS实现点击按钮随机生成可拖动的不同颜色块示例
2019/01/30 Javascript
[01:02:55]CHAOS vs Mineski 2019国际邀请赛小组赛 BO2 第二场 8.16
2019/08/18 DOTA
关于Python中异常(Exception)的汇总
2017/01/18 Python
python实现读取excel写入mysql的小工具详解
2017/11/20 Python
python3 面向对象__类的内置属性与方法的实例代码
2018/11/09 Python
浅谈pycharm的xmx和xms设置方法
2018/12/03 Python
python+selenium 定位到元素,无法点击的解决方法
2019/01/30 Python
Django框架实现的分页demo示例
2019/05/25 Python
CSS3使用transition实现的鼠标悬停淡入淡出
2015/01/09 HTML / CSS
美国全球旅游运营商:Pacific Holidays
2018/06/18 全球购物
写一个函数返回1+2+3+…+n的值(假定结果不会超过长整型变量的范围)
2014/09/05 面试题
简历中个人自我评价范文
2013/12/26 职场文书
学生期末评语大全
2014/04/30 职场文书
授权委托书(完整版)
2014/09/10 职场文书
2014年小学德育工作总结
2014/12/05 职场文书
村干部任职承诺书
2015/01/21 职场文书
大学生自荐书范文
2015/03/05 职场文书
幼儿园圣诞节活动总结
2015/05/06 职场文书
市语委办2016年第十九届“推普周”活动总结
2016/04/05 职场文书
2019个人工作总结
2019/06/21 职场文书
python_tkinter事件类型详情
2022/03/20 Python
Spring Data JPA框架Repository自定义实现
2022/04/28 Java/Android