js根据json数据中的某一个属性来给数据分组的方法

2024-09-27 11:02:09

如下所示：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<span id ="span" style="width: 50px;height: 200px;"></span>
	</body>
	<script>
	var arr = [{"Group":1,"Groupheader":"质量管理","Leftimg":"","Left":"","Min":"","Right":"","Rightimg":""},
{"Group":1,"Groupheader":"","Leftimg":"","Left":"","Min":"质量巡检","Right":"","Rightimg":""},
{"Group":2,"Groupheader":"设备管理","Leftimg":"","Left":"","Min":"","Right":"","Rightimg":""},
{"Group":2,"Groupheader":"","Leftimg":"","Left":"","Min":"设备专业点检","Right":"","Rightimg":""},
{"Group":2,"Groupheader":"","Leftimg":"","Left":"","Min":"设备日检","Right":"","Rightimg":""},
{"Group":2,"Groupheader":"","Leftimg":"","Left":"","Min":"设备周检","Right":"","Rightimg":""},
{"Group":2,"Groupheader":"","Leftimg":"","Left":"","Min":"设备月检","Right":"","Rightimg":""}];

var map = {},
 dest = [];
for(var i = 0; i < arr.length; i++){
 var ai = arr[i];
 if(!map[ai.Group]){
  dest.push({
   Group: ai.Group,

   data: [ai]
  });
  map[ai.Group] = ai;
 }else{
  for(var j = 0; j < dest.length; j++){
   var dj = dest[j];
   if(dj.Group == ai.Group){
    dj.data.push(ai);
    break;
   }
  }
 }
}
console.log(JSON.stringify(dest));
	var sapn = document.getElementById("span");
	span.innerHTML = JSON.stringify(dest);
	</script>
</html>

原始数据：

[{"Group":1,"Groupheader":"质量管理","Leftimg":"","Left":"","Min":"","Right":"","Rightimg":""},
{"Group":1,"Groupheader":"","Leftimg":"","Left":"","Min":"质量巡检","Right":"","Rightimg":""},
{"Group":2,"Groupheader":"设备管理","Leftimg":"","Left":"","Min":"","Right":"","Rightimg":""},
{"Group":2,"Groupheader":"","Leftimg":"","Left":"","Min":"设备专业点检","Right":"","Rightimg":""},
{"Group":2,"Groupheader":"","Leftimg":"","Left":"","Min":"设备日检","Right":"","Rightimg":""},
{"Group":2,"Groupheader":"","Leftimg":"","Left":"","Min":"设备周检","Right":"","Rightimg":""},
{"Group":2,"Groupheader":"","Leftimg":"","Left":"","Min":"设备月检","Right":"","Rightimg":""}];

处理后的数据：

[
 {
  "Group": 1,
  "data": [
   {
    "Group": 1,
    "Groupheader": "质量管理",
    "Leftimg": "",
    "Left": "",
    "Min": "",
    "Right": "",
    "Rightimg": ""
   },
   {
    "Group": 1,
    "Groupheader": "",
    "Leftimg": "",
    "Left": "",
    "Min": "质量巡检",
    "Right": "",
    "Rightimg": ""
   }
  ]
 },
 {
  "Group": 2,
  "data": [
   {
    "Group": 2,
    "Groupheader": "设备管理",
    "Leftimg": "",
    "Left": "",
    "Min": "",
    "Right": "",
    "Rightimg": ""
   },
   {
    "Group": 2,
    "Groupheader": "",
    "Leftimg": "",
    "Left": "",
    "Min": "设备专业点检",
    "Right": "",
    "Rightimg": ""
   },
   {
    "Group": 2,
    "Groupheader": "",
    "Leftimg": "",
    "Left": "",
    "Min": "设备日检",
    "Right": "",
    "Rightimg": ""
   },
   {
    "Group": 2,
    "Groupheader": "",
    "Leftimg": "",
    "Left": "",
    "Min": "设备周检",
    "Right": "",
    "Rightimg": ""
   },
   {
    "Group": 2,
    "Groupheader": "",
    "Leftimg": "",
    "Left": "",
    "Min": "设备月检",
    "Right": "",
    "Rightimg": ""
   }
  ]
 }
]

以上这篇js根据json数据中的某一个属性来给数据分组的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

JavaScript简单实现合并两个Json对象的方法示例

本文实例讲述了JavaScript简单实现合并两个Json对象的方法.分享给大家供大家参考,具体如下: $.mergeJsonObject = function(jsonbject1, jsonbject2) { var resultJsonObject = {}; for (var attr in jsonbject1) { resultJsonObject[attr] = jsonbject1[attr]; } for (var attr in jsonbject2) { resultJso
Queryable.Union 方法实现json格式的字符串合并的具体实例

1.在数据库中以json字符串格式保存,如:[{"name":"张三","time":"8.592","area":"27.27033","conc":"4.12136"},{"name":"李四","time":"9.100","area":&qu
JavaScript数组，JSON对象实现动态添加、修改、删除功能示例

本文实例讲述了JavaScript数组,JSON对象实现动态添加.修改.删除功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>javascript里面的数组,json对象,动态添加,修改,删除示例</t
JS实现合并json对象的方法

本文实例讲述了JS实现合并json对象的方法.分享给大家供大家参考,具体如下: 一.问题: 求json对象合并的方法 var a ={"a":"1","b":"2"} var b ={"c":"3","d":"4","e":"5"} 想得到结果: var c ={"a":"1&q
Javascript中JSON数据分组优化实践及JS操作JSON总结

现有一堆数据,我需要按时间进行分组,以便前端视图呈现 [ {"date":"2017-12-22","start_time":"10:00:00","end_time":"10:00:00","status":"Performance Time"}, {"date":"2017-12-22","st
JS实现键值对遍历json数组功能示例

本文实例讲述了JS实现键值对遍历json数组功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>www.jb51.net js键值对遍历json数组</title> </head> <body> <script type="text/javascript"
js实现json数组分组合并操作示例

本文实例讲述了js实现json数组分组合并操作.分享给大家供大家参考,具体如下: <script> var arr = [ {"id":"1001","name":"值1","value":"111"}, {"id":"1001","name":"值1","value":&qu
JS遍历JSON数组及获取JSON数组长度操作示例【测试可用】

本文实例讲述了JS遍历JSON数组及获取JSON数组长度操作.分享给大家供大家参考,具体如下: 遍历 JSON 数组: var questions = data.data.questionnaire.questions; //遍历 json 数组 for (var i in questions) { if (questions[i].type == '(单选)') { alert('danxuan'); } } 获取 JSON 数组长度: function getJsonLength(json)
JavaScript实现构造json数组的方法分析

本文实例讲述了JavaScript实现构造json数组的方法.分享给大家供大家参考,具体如下: 从后端拿到的数据是一个数组,每个元素中包含的数据如下(host相同的记录都是相邻的) currentTime:"1470729601" host:"10.3.34.21" taskList:null taskNum:1 想构造类似如下结构的json数组 [{ name: 'host:10.1.6.49', data: [ [1470641461000, 5], [1470
JavaScript实现JSON合并操作示例【递归深度合并】

本文实例讲述了JavaScript实现JSON合并操作.分享给大家供大家参考,具体如下: 为什么我会想到写这几行代码在实际工作中,我们会使用许多或自主开发或第三方的工具,有些工具的配置文件相当细节,使用频率低倒也罢了,使用频率高的话必然造成很多代码冗余.所以我都会对这些工具做二次封装,把不经常改动的配置给予默认值.如果需要改动,传入新的配置覆盖原来的配置即可. 起初我以为这是一项很简单的需求 var json1 = { // 固定的配置 a: 1, b: 2, c: 3, } var json

js根据json数据中的某一个属性来给数据分组的方法

相关推荐

随机推荐