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 textarea的长度进行验证
May 06 Javascript
利用jQuery 实现GridView异步排序、分页的代码
Feb 06 Javascript
jQuery EasyUI API 中文文档 - Tree树使用介绍
Nov 19 Javascript
ASP.NET jQuery 实例11 通过使用jQuery validation插件简单实现用户登录页面验证功能
Feb 03 Javascript
关于jquery.validate1.9.0前台验证的使用介绍
Apr 26 Javascript
jQuery移动web开发之页面跳转和加载外部页面的实现
Dec 04 Javascript
jquery实现点击弹出可放大居中及关闭的对话框(附demo源码下载)
May 10 Javascript
JS打印彩色菱形的实例代码
Aug 15 Javascript
微信小程序实现笑脸评分功能
Nov 03 Javascript
函数式编程入门实践(一)
Apr 20 Javascript
关于引入vue.js 文件的知识点总结
Jan 28 Javascript
Vue用mixin合并重复代码的实现
Nov 27 Vue.js
浅谈微信页面入口文件被缓存解决方案
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
十大催泪虐心动漫电影,有几部你还没看
2020/03/04 日漫
PHP代码保护--Zend Guard的使用详解
2013/06/03 PHP
PHP版微信公众平台红包API
2015/04/02 PHP
JavaScript与DropDownList 区别分析
2010/01/01 Javascript
JS关闭窗口或JS关闭页面的几种代码分享
2013/10/25 Javascript
js返回上一页并刷新的多种实现方法
2014/02/26 Javascript
jQuery实现的原图对比窗帘效果
2014/06/15 Javascript
js控制再次点击按钮之间的间隔时间可防止重复提交
2014/08/01 Javascript
js打造数组转json函数
2015/01/14 Javascript
JavaScript实现定时隐藏与显示图片的方法
2015/08/06 Javascript
js检测用户输入密码强度
2015/10/22 Javascript
vue 计时器组件的实现代码
2017/09/14 Javascript
JS中用EL表达式获取上下文参数值的方法
2018/03/28 Javascript
JavaScript中Array方法你该知道的正确打开方法
2018/09/11 Javascript
详解从vue-loader源码分析CSS Scoped的实现
2019/09/23 Javascript
jquery 插件重新绑定的处理方法分析
2019/11/23 jQuery
Jquery+AJAX实现无刷新上传并重命名文件操作示例【PHP后台接收】
2020/05/29 jQuery
[01:03:56]Mineski vs TNC 2018国际邀请赛淘汰赛BO1 8.21
2018/08/22 DOTA
Python多线程学习资料
2012/12/19 Python
python+mysql实现简单的web程序
2014/09/11 Python
Python线程的两种编程方式
2015/04/14 Python
pygame游戏之旅 创建游戏窗口界面
2018/11/20 Python
Python实现京东秒杀功能代码
2019/05/16 Python
django 快速启动数据库客户端程序的方法示例
2019/08/16 Python
python 使用pygame工具包实现贪吃蛇游戏(多彩版)
2019/10/30 Python
Flask之pipenv虚拟环境的实现
2019/11/26 Python
python基于plotly实现画饼状图代码实例
2019/12/16 Python
详解Pycharm出现out of memory的终极解决方法
2020/03/03 Python
class类在python中获取金融数据的实例方法
2020/12/10 Python
Python基于opencv的简单图像轮廓形状识别(全网最简单最少代码)
2021/01/28 Python
eBay比利时购物网站:eBay.be
2019/08/09 全球购物
法律工作求职自荐信
2013/10/31 职场文书
会计专业应届生自荐信
2014/02/07 职场文书
红歌会主持词
2015/07/02 职场文书
你对自己的信用报告有过了解吗?
2019/07/09 职场文书
JavaScript中关于预编译、作用域链和闭包的理解
2021/03/31 Javascript