修复JQuery表格转数组时重复列头值被空值覆盖的问题

当处理带重复列头的表格（每行仅在同一列头的某一列有有效值）时，原jQuery代码会因后续空列覆盖前序有效列值导致数据丢失。核心修复逻辑是仅当单元格有非空值时，才更新对应键的值，避免空列覆盖有效数据。

修复后的jQuery代码 #

function convertTableToArray() {
  const tableData = [];
  // 获取所有列头文本，作为数组的键
  const headers = $('#csvTable thead th').map(function() {
    return $(this).text().trim();
  }).get();

  // 遍历每一行数据
  $('#csvTable tbody tr').each(function() {
    const rowObj = {};
    $(this).find('td').each(function(colIndex) {
      const key = headers[colIndex];
      const cellValue = $(this).text().trim();
      
      // 仅当单元格值非空时才赋值，跳过空值避免覆盖
      if (cellValue) {
        rowObj[key] = cellValue;
      }
    });
    tableData.push(rowObj);
  });

  return tableData;
}

// 使用示例
const resultArray = convertTableToArray();
console.log(resultArray);

代码逻辑说明 #

1. 提取列头：通过map方法获取所有表头文本，作为数组对象的键。
2. 遍历行数据：对每一行初始化空对象存储数据。
3. 处理单元格：遍历每个单元格时，仅当单元格内容（去除首尾空白后）非空，才将值赋值给对应键。这样同一行内后续的空列不会覆盖前面已设置的有效数据。
4. 收集结果：将处理好的每行对象推入结果数组，最终得到符合需求的数组数据。

比如针对包含重复importo列的表格，处理后会正确保留每行的有效importo值，不会被空列覆盖。

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