javascript json 数据构造

问题描述

问 题

var data1 = {
    "TemplateName": "数据规范",
    "SummaryFields": [
        {
            "FieldName": "用户姓名",
            "FieldCode": "UDF_F_935",
            "Visable": true
        },
        {
            "FieldName": "当前日期",
            "FieldCode": "UDF_F_936",
            "Visable": true
        },
        {
            "FieldName": "ReportID",
            "FieldCode": "ReportID",
            "Visable": false
        }
    ],
    "Code": 0,
    "Message": null
};


var data2 = {
    "TotalCount": 2,
    "ReturnData": [
        {
            "UDF_F_935": "超级管理员",
            "UDF_F_936": "2009-05-01",
            "UDF_F_938": "admin",
            "UDF_F_942": "女",
            "UDF_F_943": "丙",
            "ReportID": "221"
        },
        {
            "UDF_F_935": "超级管理员",
            "UDF_F_936": "2009-05-01",
            "UDF_F_938": "admin",
            "UDF_F_942": "男",
            "UDF_F_943": "乙",
            "ReportID": "220"
        }
    ],
    "Code": 0,
    "Message": null
};

列表显示效果如下：

用户姓名:超级管理员,  
当前日期:2009-05-01,  
ReportID:221


用户姓名:超级管理员,  
当前日期:2009-05-01,  
ReportID:220

如何使用 javascript 构造列表相应的json数据？尽量提高性能

解决方案

// es6
const map = data1.SummaryFields.reduce((r, t) => {
    r[t.FieldCode] = t.FieldName;
    return r;
}, {});

const result = data2.ReturnData.map(m => {
    return Object.keys(m).reduce((r, key) => {
        const name = map[key];
        if (name) {
            r[name] = m[key];
        }
        return r;
    }, {});
});

补充：两种数据的表格表示

一般情况下，生成的行数据是不可能包含列信息的。如果实在想包含列信息，那就得像第二个表格那样，在数据里把行信息和列信息的包含进去。不过所有列信息都会大量重复。

如果数据是为了显示在界面上的表格里，通常应该在 UI 层来控制列是否显示。如果数据是为了提供给另外一个组件，通常应该是把列数据和行数据分别提供，比如

{
    columns: [],
    rows: []
}

这篇关于javascript json 数据构造的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！