1.给后台传递数组对象(子数组对象)

1、举例一个场景要求

需要对原数组数据提取每个对象的 goodsId 和 goodsName，以及对应的 goodsPrices 数组中每个对象的 id 和 roomDay，将这些值组合成新的对象，并存入一个新的数组中

js
let arrList = [
  {
    goodsId: 1,
    goodsName: '商品1',
    goodsPrice: 100,
    goodsNum: 1,
    goodsPrices: [
      {
        id: 1,
        newRoomPrice: 100, //新房价
        roomDay: '2023-02-10', //日期
      },
      {
        id: 2,
        newRoomPrice: 100, //新房价
        roomDay: '2023-02-11', //日期
      },
      {
        id: 3,
        newRoomPrice: 100, //新房价
        roomDay: '2023-02-12', //日期
      },
      {
        id: 4,
        newRoomPrice: 100, //新房价
        roomDay: '2023-02-13', //日期
      },
    ],
  },
  {
    goodsId: 2,
    goodsName: '商品2',
    goodsPrice: 100,
    goodsNum: 1,
    goodsPrices: [
      {
        id: 1,
        newRoomPrice: 100, //新房价
        roomDay: '2023-02-10', //日期
      },
      {
        id: 2,
        newRoomPrice: 100, //新房价
        roomDay: '2023-02-11', //日期
      },
      {
        id: 3,
        newRoomPrice: 100, //新房价
        roomDay: '2023-02-12', //日期
      },
    ],
  },
  {
    goodsId: 3,
    goodsName: '商品3',
    goodsPrice: 100,
    goodsNum: 1,
    goodsPrices: [
      {
        id: 1,
        newRoomPrice: 100, //新房价
        roomDay: '2023-02-10', //日期
      },
      {
        id: 2,
        newRoomPrice: 100, //新房价
        roomDay: '2023-02-11', //日期
      },
    ],
  },
]

解决方案（一）

1、你可以通过 `Array.map()` 方法遍历 `arrList` 数组，然后针对每一项对象生成新的数组项，包含 `goodsId`、`goodsName`、`id`、`roomDay` 等信息。具体实现如下

js
const newData = arrList.map((item) => {
  const { goodsId, goodsName, goodsPrices } = item
  const newGoodsPrices = goodsPrices.map(({ id, roomDay }) => ({ id, roomDay }))
  return { goodsId, goodsName, goodsPrices: newGoodsPrices }
})

console.log(newData)

代码解释

上述代码中，通过解构赋值将每个对象的 goodsId、goodsName、goodsPrices 提取出来，然后对 goodsPrices 数组再次使用 Array.map() 方法，取出每个对象中的 id 和 roomDay 属性，生成新的数组项。最后返回一个新的对象，包含 goodsId、goodsName 和新的 goodsPrices 数组。整个过程可以一步到位，不需要定义中间变量。

解决方案（二）

2、除了使用 map 方法之外，你还可以使用 for 循环来遍历原数组，并将每一项的 goodsId、goodsName 以及对应的 goodsPrices 的 id、roomDay 组成一个新对象，再将这个对象推入一个新数组中。以下是使用 for 循环实现的示例代码

js
let newArrList = []

for (let i = 0; i < arrList.length; i++) {
  let obj = {
    goodsId: arrList[i].goodsId,
    goodsName: arrList[i].goodsName,
    goodsPrices: [],
  }

  for (let j = 0; j < arrList[i].goodsPrices.length; j++) {
    obj.goodsPrices.push({
      id: arrList[i].goodsPrices[j].id,
      roomDay: arrList[i].goodsPrices[j].roomDay,
    })
  }

  newArrList.push(obj)
}

console.log(newArrList)

// 输出结果与使用map方法得到的结果相同。

代码解释

这段代码是对给定的数组 arrList 进行遍历，然后将每一项转换为一个新的对象，并将这些新的对象添加到一个新的数组 newArrList 中。

具体来说，内部循环遍历了每个商品的价格数组 goodsPrices，将其转换为新的对象并将其添加到新数组 goodsPrices 中。外部循环遍历了每个商品对象，每个商品对象的 goodsId、goodsName 属性被保存下来，并且将内部循环中转换出来的 goodsPrices 数组添加到新的商品对象中。最终得到的是一个新的数组 newArrList，其中每个元素都是一个包含商品信息和价格信息的对象。

解决方案（三）

3、需要对原数组进行遍历，提取每个对象的 goodsId 和 goodsName，以及对应的 goodsPrices 数组中每个对象的 id 和 roomDay，将这些值组合成新的对象，并存入一个新的数组中。可以使用 map()+forEach 方法实现这个过程

js
const newArrList = arrList.map((item) => {
  const newObj = {
    goodsId: item.goodsId,
    goodsName: item.goodsName,
    goodsPrices: [],
  }
  item.goodsPrices.forEach((priceItem) => {
    newObj.goodsPrices.push({
      id: priceItem.id,
      roomDay: priceItem.roomDay,
    })
  })
  return newObj
})

// 输出新数组
console.log(newArrList)

代码解释

这里定义了一个新的空数组 newArrList，然后使用 map()方法对原数组进行遍历，map()方法会返回一个新的数组，将每次循环得到的新对象存入这个新数组中。在每次遍历时，首先创建一个空对象 newObj，然后将当前遍历到的对象的 goodsId 和 goodsName 赋值给这个新对象。然后，对当前对象的 goodsPrices 数组进行遍历，将每个对象的 id 和 roomDay 提取出来，存入一个新的对象中，并将这个新的对象存入 newObj 对象的 goodsPrices 数组中。最后，返回这个新对象。

通过这个代码，我们将原数组中每个对象的 goodsId、goodsName 和对应的 goodsPrices 数组中的 id 和 roomDay 提取出来，组成了一个新的数组。

目录