如何在javascript中为两个对象和数组进行映射答案

【问题标题】：How to do mapping for two objects and array in javascript如何在javascript中为两个对象和数组进行映射
【发布时间】：2026-02-14 15:05:02
【问题描述】：

我有这样一个对象和数组，我收到了服务器的响应。我需要将其转换为下面的第二种格式，以便在网站中打印该值。这是需要做对象映射的事情吗？或解析 JSON 或请帮助。

{"header":["SEOUL","BUSAN","NAMPODONG"],"data":[[38,"CAPITAL","M31"]]},

从上面转换到下面

'{"SEOUL" : "38", "BUSAN" : "CAPITAL", "NAMPODONG" : "M31"}'

var finalObj = {};
response.header.forEach(function(item, index) {
finalObj[item] = response.data[0][index];
});

上面的代码工作正常，因为它创建了变量并为 header 循环并获取它的值并打印在 html 中。标头和数据来自服务器，因此当我输入一些内容时，让我们说“A”，然后它会查找 SEOUL 标头，然后在 html 中打印 38，如下表所示。

键值：A

标题：首尔釜山南浦东

数据：38 CAPITAL M31

我的数据库里确实有很多数据，上面只是一个例子。所以假设我输入 B 然后 B 不在数据库中，所以我想在 html 中查看值“No found”，但是这段代码什么也没打印，所以不确定它是否继续。

【问题讨论】：

是对象还是JSON字符串？
所以你需要一个过滤机制。过滤器是如何工作的？为什么A会选择第一个对象？

标签： javascript arrays json mapping

【解决方案1】：

创建一个变量并在object.header 上循环以获取每个键，object.data[0] 以获取其值

var myObj = {
  "header": ["SEOUL", "BUSAN", "NAMPODONG"],
  "data": [
    [38, "CAPITAL", "M31"]
  ]
}
var tempObj = {};
myObj.header.forEach(function(item, index) {
  tempObj[item] = myObj.data[0][index]


})
console.log(tempObj)

【讨论】：

data 可能会有更多条目。
非常感谢！！ :-) @brk

【解决方案2】：

当您从服务器收到它时——我假设它是 JSON 字符串。

基本上你有两个数组，你想reduce 到一个对象。所以我会这样做：

const object = JSON.parse('{"header":["SEOUL","BUSAN","NAMPODONG"],"data":[[38,"CAPITAL","M31"]]}');

const result = object.header.reduce(function(accumulator, element, i){
  accumulator[element] = object.data[0][i] // You had nested array here so I have to get first element.
  return accumulator;
}, {});
console.log(result);

我认为data 属性的嵌套数组是某种格式错误。如果不是 - 你必须 map 虽然它首先是元素，然后才减少。

【讨论】：

【解决方案3】：

您可以使用 Ramda 库中的 zipObj。

代码如下所示：

const res = {"header":["SEOUL","BUSAN","NAMPODONG"],"data":[[38,"CAPITAL","M31"]]}

const obj = R.zipObj(res.header, res.data[0])
console.log(obj)

&lt;script src="//cdn.jsdelivr.net/npm/ramda@latest/dist/ramda.min.js"&gt;&lt;/script&gt;

【讨论】：

【解决方案4】：

你可以用想要的键映射新对象。

结果是一个包含对象的数组，因为您的数据是一个嵌套数组，实际上只有一个数组。但看起来 taht 数据可能包含不止一行。

var data = { header: ["SEOUL", "BUSAN", "NAMPODONG"], data: [[38, "CAPITAL", "M31"]] },
    result = data.data.map(a => Object.assign(...data.header.map((k, i) => ({ [k]: a[i] }))));

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：

【解决方案5】：

您可以将 data 数组数组映射到另一个对象数组，使用 header 数组中的字符串作为键：

function transform(obj) {
  return obj.data.map(function(subArray) {             // for each subArray in the data array
    return subArray.reduce(function(o, val, i) {       // create a new object o which...
      o[ obj.header[i] ] = val;                        // has key-value pairs where value is the current element of subArray and key is its equivalent (item at the same index) from header array
      return o;
    }, {});
  });
}


var obj = {"header":["SEOUL","BUSAN","NAMPODONG"],"data":[[38,"CAPITAL","M31"], [10,"OTHER","M01"]]};
var result = transform(obj);

console.log(result);

【讨论】：

@HelloWorld 我不明白。你能详细说明一下吗。可能为了清楚起见编辑问题，因为 cmets 无济于事。

【解决方案6】：

我认为上面的回答都很好，但如果你不知道，这里有一个使用 reduce 的替代方法

var response = {
  "header": ["SEOUL", "BUSAN", "NAMPODONG"],
  "data": [
    [38, "CAPITAL", "M31"]
  ]
};

var result = response.header.reduce(function(accum, v, i) {
    accum[v] = response.data[0][i];
    return accum;
}, {})

console.log(result)

【讨论】：