如何优化二维数组数据提取代码？无需拆分数组的简化实现

首先明确我们的转换需求：
原二维数组结构：

const bArray = [ 
  [ 'Hello World', 'Hi everybody', 'How are you?' ], 
  [ 
    { text: 'Hola Mundo', from: {}, raw: '' }, 
    { text: 'Hola a todos', from: {}, raw: '' }, 
    { text: 'Cómo estás?', from: {}, raw: '' }
  ] 
];

需要转换为的目标结构：

[ 
  { en: 'Hello World', es: 'Hola Mundo' }, 
  { en: 'Hi everybody', es: 'Hola a todos' }, 
  { en: 'How are you?', es: 'Cómo estás?' }
]

当然可以！完全不需要先拆分成val1、val2两个中间数组，我们可以直接利用数组的原生方法一步完成转换，这里推荐两种简洁的实现方式：

方法一：使用map（最适配的场景） #

利用两个子数组元素索引一一对应的特性，直接遍历第一个子数组，同时通过索引从第二个子数组中取对应值：

const transformedArray = bArray[0].map((enText, index) => ({
  en: enText,
  es: bArray[1][index].text
}));

map天生就是用来处理这种“一对一映射转换”的场景，代码简洁直观，没有多余的中间变量，逻辑一目了然。

方法二：使用reduce #

如果更习惯用reduce来处理数组聚合，也可以实现：

const transformedArray = bArray[0].reduce((result, enText, index) => {
  result.push({
    en: enText,
    es: bArray[1][index].text
  });
  return result;
}, []);

这种写法通过累积器逐步构建目标数组，同样不需要拆分原数组，不过相比map来说，代码稍显繁琐，更适合复杂的聚合场景。

两种方法都能达到预期效果，且都避免了额外的中间数组创建，让代码更紧凑易维护～

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