欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

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

程序员文章站 2023-11-11 17:18:16
如下所示:

如下所示:

<!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数据中的某一个属性来给数据分组的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。