将键、值 JSON 数组转换为表格 JSON 格式

我有以下图表的 JSON 数据


var chartJson = [

    {

        header : '2016',

        values : [1, 5, 9]

    },

    {

        header : '2017',

        values : [2, 4, 8]

    },

    {

        header : '2018',

        values : [3, 1, 5]

    }

];

并需要将其转换为这种格式以提供我的 HTML 表


var tableJson = [

    {

        2016 : 1,

        2017 : 2,

        2018 : 3

    },

    {

        2016 : 5,

        2017 : 4,

        2018 : 1

    },

    {

        2016 : 9,

        2017 : 8,

        2018 : 5

    }

];

任何将其转换为这种格式的快速帮助将不胜感激。我尝试使用这段代码,但不知何故缺少逻辑。


let table = [];

    for(var row of chartJson ){

        for(var value of row.values)

        {

            table.push(

                {

                    column : row.header,

                    value : value

                });

        }

    }


富国沪深
浏览 126回答 3
3回答

狐的传说

var chartJson = [{    header: '2016',    values: [1, 5, 9]  },  {    header: '2017',    values: [2, 4, 8]  },  {    header: '2018',    values: [3, 1, 5]  }];let table = [];chartJson.forEach((row, index) => {  row.values.forEach((val, j) => {    table[j] = { ...table[j],      [row.header]: val    }  });});console.log(table)

汪汪一只猫

迭代每个chartJson' 元素及其值(通过内部循环)直到values'length 并从中创建一个对象。最后,将该对象推入table数组中。就是这样。看看下面的片段:var chartJson = [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; header: '2016',&nbsp; &nbsp; &nbsp; &nbsp; values: [1, 5, 9]&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; header: '2017',&nbsp; &nbsp; &nbsp; &nbsp; values: [2, 4, 8]&nbsp; &nbsp; },&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp; header: '2018',&nbsp; &nbsp; &nbsp; &nbsp; values: [3, 1, 5]&nbsp; &nbsp; }];let table = [];let len_of_chartJson = chartJson.length, len_of_values = chartJson[0].values.length;for (var i = 0; i < len_of_chartJson; i++) {&nbsp; &nbsp; let obj = {};&nbsp; &nbsp; for (var j = 0; j < len_of_values; j++) {&nbsp; &nbsp; &nbsp; &nbsp; obj[chartJson[j].header] = chartJson[j].values[i];&nbsp; &nbsp; }&nbsp; &nbsp; table.push(obj);}console.log(table);

Qyouu

let table = chartJson.reduce((tbl, rec) => {          rec.values.forEach((num, index) => {                  if(!tbl[index]){                          tbl[index] = {}                  }                  tbl[index][rec.header] = num          })          return tbl          }, [])数组reduce函数用于循环遍历每个对象,比每个对象循环遍历每个值,检查表中是否存在索引,如果不存在,则在当前索引处创建一个空对象。最后它在当前索引对象中创建一个键值。
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript