对比两个JSON数组提取数据生成指定嵌套数组的实现问题

• 遍历Array1取出所有value值，作为要匹配的Array2对象的键名
• 对每一个拿到的键名，遍历Array2的所有对象，收集该键名对应的属性值
• 将所有收集到的属性值数组按Array1的顺序组合，即可得到目标结果

简洁版（ES6+） #

// 定义原始数组
const Array1 = [{ label: "HEADER", value:"header" }, { label: "FOOTER", value:"footer" }];
const Array2 = [ { header: "Header 1", footer: "Footer 1" }, { header: "Header 2", footer: "Footer 2" }];

// 核心处理逻辑
const result = Array1.map(({ value }) => Array2.map(item => item[value]));

console.log(result); // 输出结果：[["Header 1","Header 2"],["Footer 1","Footer 2"]]

兼容旧环境版（for循环实现） #

const result = [];
// 遍历Array1取键名
for (let i = 0; i < Array1.length; i++) {
  const currentKey = Array1[i].value;
  const valueList = [];
  // 遍历Array2收集对应值
  for (let j = 0; j < Array2.length; j++) {
    valueList.push(Array2[j][currentKey]);
  }
  result.push(valueList);
}

如果Array2中存在部分对象不包含对应键名的场景，可以在收集值时增加过滤逻辑，避免出现undefined：

const result = Array1.map(({ value }) => 
  Array2.map(item => item[value]).filter(val => val !== undefined)
);

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