如何将对象二维数组转换为对象一维数组？flat与Lodash方法失效问题

当前输入结构 #

原始boxlist的初始结构如下：

boxlist = [
 {
   boxId: '94sdsd65cc9',
   boxSize: 'Small',
   boxType: 'box',
   items: [Array(12), Array(2)]
 }
]

其中items字段实际存储的是对象二维数组，展开后的真实结构示例：

items 二维数组结构示例

items : [
  [{id: 1, name: "item1", write: true}],
  [{id: 3, name: "item3", write: true}]
]

预期输出结构 #

处理完成后需要保持boxlist外层结构不变，仅将items字段从嵌套的二维数组拍平为对象一维数组，目标结构如下：

boxlist = [
 {
   boxId:'94sdsd65cc9',
   boxSize:'Small',
   boxType:'box',
   items: [
     // 拍平后的单层次对象数组
     {id: 1, name: "item1", write: true},
     {id: 3, name: "item3", write: true}
   ]
 }
]

最终items字段需要达到的一维数组效果：

items 一维数组目标结构示例

items = [
  {id: 1, name: "item1", write: true},
  {id: 3, name: "item3", write: true}
]

已尝试的失效方案 #

• 直接调用items.flat()方法，执行后原二维数组结构未发生任何变化
• 引入Lodash工具库，调用flatten、flattenDeep、flattenDepth方法，同样未实现数组拍平效果

可落地的实现代码 #

原生JS实现：

// 遍历boxlist的每一个箱子对象
const result = boxlist.map(box => {
  // 对items做1层拍平，将结果回写到items字段
  box.items = box.items.flat(1)
  return box
})

如果之前调用flat()未生效，通常是两个原因：

• flat()是纯数组方法，不会修改原数组，必须将方法返回的新数组赋值给box.items字段才能生效
• 调用时没有传正确的拍平层数参数，针对两层固定嵌套的场景传1即可，不确定嵌套深度时可以传Infinity实现全层级拍平
  Lodash实现：

const result = _.map(boxlist, box => {
  box.items = _.flattenDeep(box.items)
  return box
})

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