React-Native中JSON嵌套数组数据映射实现求助

咱们来看看你的代码问题出在哪，然后一步步修正：

你的代码核心问题 #

1. 只处理了单个对象：你用let dataObj = json.data[0]只取了data数组里的第一个元素，完全没遍历整个数组里的所有对象；
2. 错误操作基本类型值：dataObj[key]返回的是数字、字符串这类基本类型值，你给这些值添加keyName属性是无效的——JS里基本类型无法添加自定义属性，而且这也不是你想要的结构（应该是包含键名和对应值的新对象）。

正确实现方式 #

如果你想把data数组里的每个对象，都转换成包含keyName和对应值的对象数组，可以这样写：

let json = { "data": [ { "id": 1, "name": "Test" }, { "id": 2, "name": "Test" } ] };

// 方案1：保留原数组层级，每个元素对应一组键值对数组
let groupedResult = json.data.map(item => {
  return Object.keys(item).map(key => {
    return {
      keyName: key,
      value: item[key]
    };
  });
});

// 方案2：把所有键值对合并成一个一维数组
let flatResult = json.data.flatMap(item => {
  return Object.keys(item).map(key => {
    return {
      keyName: key,
      value: item[key]
    };
  });
});

输出示例 #

• groupedResult的结果：

[
  [ { keyName: "id", value: 1 }, { keyName: "name", value: "Test" } ],
  [ { keyName: "id", value: 2 }, { keyName: "name", value: "Test" } ]
]

• flatResult的结果：

[
  { keyName: "id", value: 1 },
  { keyName: "name", value: "Test" },
  { keyName: "id", value: 2 },
  { keyName: "name", value: "Test" }
]

这样就完整处理了data数组里的所有元素，生成了你想要的包含键名的对象结构。

内容的提问来源于stack exchange，提问作者Sam Bellerose