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 相关文章推荐
jQuery学习笔记 更改jQuery对象
Sep 19 Javascript
jquery文字上下滚动的实现方法
Mar 22 Javascript
关于JS判断图片是否加载完成且获取图片宽度的方法
Apr 09 Javascript
关于jQuery新的事件绑定机制on()的使用技巧
Apr 26 Javascript
JavaScript实现页面实时显示当前时间的简单实例
Jul 20 Javascript
javascript轻松实现当鼠标移开时已弹出子菜单自动消失
Dec 29 Javascript
js数组中如何随机取出一个值
Jun 13 Javascript
javascript将浮点数转换成整数的三个方法
Jun 23 Javascript
基于javascript实现精确到毫秒的倒计时限时抢购
Apr 17 Javascript
Vim快速合并行及vim 将文件所有行合并到一行
Nov 27 Javascript
Node.js操作系统OS模块用法分析
Jan 04 Javascript
layui 上传插件 带预览 非自动上传功能的实例(非常实用)
Sep 23 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生成静态文件的多种方法分享
2012/07/17 PHP
php把数据表导出为Excel表的最简单、最快的方法(不用插件)
2014/05/10 PHP
php轻松实现中英文混排字符串截取
2014/05/28 PHP
PHP中的socket_read和socket_recv区别详解
2015/02/09 PHP
PHP实现小偷程序实例
2016/10/31 PHP
jquery实现的可隐藏重现的靠边悬浮层实例代码
2013/05/27 Javascript
jsPDF生成pdf后在网页展示实例
2014/01/16 Javascript
为什么Node.js会这么火呢?Node.js流行的原因
2014/12/01 Javascript
JS基于面向对象实现的放烟花效果
2015/05/07 Javascript
JavaScript中Number.MAX_VALUE属性的使用方法
2015/06/04 Javascript
js随机生成26个大小写字母
2016/02/12 Javascript
JavaScript中判断数据类型的方法总结
2016/05/24 Javascript
利用原生JS自动生成文章标题树的实例
2016/08/22 Javascript
jQuery实现页面滚动时智能浮动定位
2017/01/08 Javascript
javascript 中的继承实例详解
2017/05/05 Javascript
JS中使用media实现响应式布局
2017/08/04 Javascript
bootstrap-table组合表头的实现方法
2017/09/07 Javascript
vue.js中实现登录控制的方法示例
2018/04/23 Javascript
详解Puppeteer 入门教程
2018/05/09 Javascript
JavaScript工具库之Lodash详解
2019/06/15 Javascript
Vue 解决父组件跳转子路由后当前导航active样式消失问题
2020/07/21 Javascript
python实现字符串和日期相互转换的方法
2015/05/13 Python
python操作mongodb根据_id查询数据的实现方法
2015/05/20 Python
基于python yield机制的异步操作同步化编程模型
2016/03/18 Python
利用Python爬取微博数据生成词云图片实例代码
2017/08/31 Python
Python实现插入排序和选择排序的方法
2019/05/12 Python
python re.sub()替换正则的匹配内容方法
2019/07/22 Python
深入研究HTML5实现图片压缩上传功能
2016/03/25 HTML / CSS
英国高档时尚男装购物网站:MR PORTER
2016/08/09 全球购物
日本食品网上商店:JaponShop.com
2017/11/28 全球购物
Magee 1866官网:Donegal粗花呢外套和大衣专家
2019/11/01 全球购物
小班教师个人总结
2015/02/05 职场文书
学生党支部工作总结2015
2015/05/26 职场文书
2016党员发展对象培训心得体会
2016/01/08 职场文书
写自招自荐信的绝招!
2019/04/19 职场文书
Python经常使用的一些内置函数
2022/04/11 Python