如何实现按指定列合并长度不等的JavaScript数组？

问题分析 #

现有代码仅能合并两个数组中匹配的行，当其中一个数组存在无匹配项的行时（比如示例中arrA的[60,5,"zzz"]），这类行会被忽略，无法得到包含所有行的合并结果。需要修改逻辑，确保所有行都被保留，无匹配项的位置填充默认值（如空字符串）。

修改后的实现代码 #

function mergeRowsLOOP_n() {
  const arrB = [
    ["id", "name"],
    [1, "Alice"],
    [2, "Bob"],
  ];

  const arrA = [
    ["age", "ID", "AAA"],
    [25, 1, "aaa"],
    [30, 2, "bbb"],
    [60, 5, "zzz"]
  ];

  let X = mergeRowsLOOP(arrA, arrB, "ID", "id");
  console.log(X)
}

// a= array1, b=array2
// aKey = array1的匹配表头, bKey = array2的匹配表头
// bColumns = 要保留的array2列索引；空数组则保留除匹配键外的所有列
function mergeRowsLOOP(a, b, aKey, bKey, bColumns = []) {
  // 统一转为小写，避免大小写问题
  const aKeyLower = aKey.toLowerCase();
  const bKeyLower = bKey.toLowerCase();

  // 1. 找到array1中匹配键的索引
  const aIdx = a[0].findIndex(s => s.toLowerCase() === aKeyLower);
  if (aIdx === -1) throw new Error(`array1中未找到匹配表头：${aKey}`);

  // 2. 处理array2：筛选要保留的列，并创建匹配键到行数据的映射
  const bIdx = b[0].findIndex(s => s.toLowerCase() === bKeyLower);
  if (bIdx === -1) throw new Error(`array2中未找到匹配表头：${bKey}`);

  // 确定array2要保留的列（排除匹配键）
  let targetBColumns;
  if (bColumns.length === 0) {
    // 保留除bKey外的所有列
    targetBColumns = b[0].filter((_, idx) => idx !== bIdx);
  } else {
    // 保留指定列（自动排除bKey）
    targetBColumns = bColumns.map(idx => b[0][idx]).filter(col => col.toLowerCase() !== bKeyLower);
  }

  // 创建映射表：匹配键值 -> array2对应行的目标列数据
  const bMap = new Map();
  for (let i = 1; i < b.length; i++) {
    const row = b[i];
    const key = row[bIdx].toString().toLowerCase();
    // 提取目标列的数据
    const values = targetBColumns.map(colName => {
      const colIdx = b[0].findIndex(s => s.toLowerCase() === colName.toLowerCase());
      return row[colIdx] || '';
    });
    bMap.set(key, values);
  }

  // 3. 构建合并后的数组
  const mergedArray = [];

  // 处理表头：array1表头去掉aKey，加上array2的目标表头
  const mergedHeader = [
    ...a[0].filter((_, idx) => idx !== aIdx),
    ...targetBColumns
  ];
  mergedArray.push(mergedHeader);

  // 处理array1的每一行数据
  for (let i = 1; i < a.length; i++) {
    const rowA = a[i];
    const matchKey = rowA[aIdx].toString().toLowerCase();
    // 去掉匹配键所在的列
    const rowAWithoutKey = rowA.filter((_, idx) => idx !== aIdx);
    // 获取匹配的array2数据，无匹配则填充空值
    const bValues = bMap.get(matchKey) || Array(targetBColumns.length).fill('');
    // 合并行
    mergedArray.push([...rowAWithoutKey, ...bValues]);
  }

  // （可选）如果需要保留array2中未在array1出现的行，取消下面注释
  // const aKeys = new Set();
  // for (let i = 1; i < a.length; i++) {
  //   aKeys.add(a[i][aIdx].toString().toLowerCase());
  // }
  // for (let [key, values] of bMap) {
  //   if (!aKeys.has(key)) {
  //     // 填充array1列的空值
  //     const emptyAValues = Array(mergedHeader.length - targetBColumns.length).fill('');
  //     mergedArray.push([...emptyAValues, ...values]);
  //   }
  // }

  return mergedArray;
}

关键改动说明 #

1. 创建映射表：用Map存储array2中匹配键到目标列数据的映射，替代双重循环，提升查找效率，同时方便处理无匹配的情况。
2. 保留所有行：遍历array1的每一行，无论是否匹配到array2的数据，都会加入结果数组，无匹配时用空字符串填充对应列。
3. 避免修改原数组：使用filter替代splice处理列的移除，防止原数组被意外修改。
4. 可选处理array2额外行：如果需要保留array2中未在array1出现的行，可取消注释对应的代码块，填充array1列的空值后加入结果。

测试结果 #

运行mergeRowsLOOP_n()后，输出与期望一致：

[
  [ 'age', 'AAA', 'name' ],
  [ 25, 'aaa', 'Alice' ],
  [ 30, 'bbb', 'Bob' ],
  [ 60, 'zzz', '' ] 
]

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