在javascript / jquery中解析多级嵌套json

Question

这是我正在使用的json，

{
    "location": [
        {
            "location_name": "Delhi",
            "latitude": "19.07598",
            "longitude": "72.87766",
            "location_id": 1,
            "center": [
                {
                    "center_name": "Center 1",
                    "cc_id": "1",
                    "date": "10/10/2014",
                    "dept": [
                        {
                            "id": 1,
                            "name": "Accounting",
                            "vitals": [
                                {
                                    "vital_name": "Attendance",
                                    "vital_val": "95%"
                                },
                                {
                                    "vital_name": "Avg. Overtime%",
                                    "vital_val": "1.2"
                                }
                            ]
                        },
                        {
                            "id": 2,
                            "name": "HR",
                            "vitals": [
                                {
                                    "vital_name": "Attendance",
                                    "vital_val": "97%"
                                },
                                {
                                    "vital_name": "Total Interns",
                                    "vital_val": "25%"
                                }
                            ]
                        }
                    ]
                },
                {
                    "center_name": "Center 2",
                    "cc_id": "2",
                    "date": "10/10/2014",
                    "dept": [
                        {
                            "id": 1,
                            "name": "IT",
                            "vitals": [
                                {
                                    "vital_name": "Attendance",
                                    "vital_val": "99%"
                                },
                                {
                                    "vital_name": "Avg. Overtime",
                                    "vital_val": "1.5"
                                }
                            ]
                        }
                    ]
                }
            ]
        },
        {
            "location_name": "Bangalore",
            "latitude": "12.97160",
            "longitude": "77.87766",
            "location_id": 2,
            "center": [
                {
                    "center_name": "Center 3",
                    "cc_id": "3",
                    "date": "12/12/2014",
                    "dept": [
                        {
                            "id": 1,
                            "name": "Customer Support",
                            "vitals": [
                                {
                                    "vital_name": "Attendance",
                                    "vital_val": "98%"
                                },
                                {
                                    "vital_name": "Fresh Hires",
                                    "vital_val": "35%"
                                }
                            ]
                        }
                    ]
                }
            ]
        }
    ]
}

我需要的是获得给定位置下所有部门的所有生命。因此，如果给定的位置是德里，我需要按部门分组的生命数据。并按中心进一步分组。这是我的代码，

   for (i in obj.location) {
        var data_node = obj.location[i];
        if (data_node.location_id == locId) {
          var centers = data_node.center;
          for (c in centers){
           var cc = centers[c];
             var dept_node = cc.dept;   
             var dept = dept_node;
             for (j in dept) {
                var vit = dept[j];
                for (k in vit.vitals) {

                }
            }
          }
        }
    }

但我不认为我走在正确的道路上，因为它不起作用。我做错了什么？

我想要的是从数据中创建一个这样的表，

Answer 1

您可以使用filter，reduce和map：

var a = {
    "location": [
        {
            "location_name": "Delhi",
            "latitude": "19.07598",
            "longitude": "72.87766",
            "location_id": 1,
            "center": [
                {
                    "center_name": "Center 1",
                    "cc_id": "1",
                    "date": "10/10/2014",
                    "dept": [
                        {
                            "id": 1,
                            "name": "Accounting",
                            "vitals": [
                                {
                                    "vital_name": "Attendance",
                                    "vital_val": "95%"
                                },
                                {
                                    "vital_name": "Avg. Overtime%",
                                    "vital_val": "1.2"
                                }
                            ]
                        },
                        {
                            "id": 2,
                            "name": "HR",
                            "vitals": [
                                {
                                    "vital_name": "Attendance",
                                    "vital_val": "97%"
                                },
                                {
                                    "vital_name": "Total Interns",
                                    "vital_val": "25%"
                                }
                            ]
                        }
                    ]
                },
                {
                    "center_name": "Center 2",
                    "cc_id": "2",
                    "date": "10/10/2014",
                    "dept": [
                        {
                            "id": 1,
                            "name": "IT",
                            "vitals": [
                                {
                                    "vital_name": "Attendance",
                                    "vital_val": "99%"
                                },
                                {
                                    "vital_name": "Avg. Overtime",
                                    "vital_val": "1.5"
                                }
                            ]
                        }
                    ]
                }
            ]
        },
        {
            "location_name": "Bangalore",
            "latitude": "12.97160",
            "longitude": "77.87766",
            "location_id": 2,
            "center": [
                {
                    "center_name": "Center 3",
                    "cc_id": "3",
                    "date": "12/12/2014",
                    "dept": [
                        {
                            "id": 1,
                            "name": "Customer Support",
                            "vitals": [
                                {
                                    "vital_name": "Attendance",
                                    "vital_val": "98%"
                                },
                                {
                                    "vital_name": "Fresh Hires",
                                    "vital_val": "35%"
                                }
                            ]
                        }
                    ]
                }
            ]
        }
    ]
}


var result = a.location.filter(function(item) {
		return item.location_name === "Delhi";
	})
	.reduce(function(element) {
		return element;
	})
	.center.map(function(element) {
		return element.dept;
	}).reduce(function(element) {
		return element
	}).map(function(element){
      return element.vitals;
    });

console.log(result)

$("body").append(JSON.stringify(result))

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body></body>

Answer 2

我制作了一个小程序，输出你显示的表格。

$(document).ready(function() {
    var table = {title : "", columns : []};

    // Create table columns
    for (i in obj.location) {
        var data_node = obj.location[i];
        if (data_node.location_id == 1) {
            var centers = data_node.center;
            table.title = data_node.location_name;
            for (c in centers){
                var new_column = [];
                var cc = centers[c];
                var dept_node = cc.dept;   
                var dept = dept_node;

                new_column.push("(center_name) " + cc.center_name);
                new_column.push("(date) " + cc.date);
                for (j in dept) {
                    new_column.push("(dept -) " + dept[j].name)
                    var vit = dept[j];
                    for (k in vit.vitals) {
                        new_column.push("(vital)" + vit.vitals[k].vital_name + "& (vital_value) " + vit.vitals[k].vital_value);
                    }
                    new_column.push("");
                }
                table.columns.push(new_column);
            }
        }
    }

    // Make sure are columns are of the same length, else rendering will not work
    var maxElements = 0;
    table.columns.forEach(function(column) {
        if (column.length > maxElements)
            maxElements = column.length;
    });

    table.columns.forEach(function(column) {
        while (column.length < maxElements) {
            column.push("");
        }
    });


    // Render all columns
    $("table tbody").append("<tr><td colspan='100'>(location_title) " + table.title + "</td></tr>");
    for (var i = 0; i < maxElements; ++i) {
        var row_cells = [];
        table.columns.forEach(function(column) {
            row_cells.push(column[i]);
        })
        console.log("<td>" + row_cells.join("</td><td>") + "</td>");
        $("table tbody").append("<tr><td>" + row_cells.join("</td><td>") + "</td></tr>");
    }
});