使用来自另一个对象的过滤器创建新对象答案

【问题标题】：Create new Object with filter from another Object使用来自另一个对象的过滤器创建新对象
【发布时间】：2020-07-07 08:41:57
【问题描述】：

我有一个来自后端的对象数组，如下所示：

items = [{
    id: 0
    name: "example1"
    price: 15
    sizes: [10, 12, 15.5]
    types: ["one", "two"]
  },
  {
    id: 1
    name: "example2"
    price: 15
    sizes: [10, 12, 15.5]
    types: ["one", "two"]
  }
]

我收到 id 作为道具并像这样使用 find()：

let addedItem = items.find((item) =&gt; item.id === id)

结果（对于 id = 0）：

addedItem = {
  id: 0
  name: "example1"
  price: 15
  sizes: [10, 12, 15.5]
  types: ["one", "two"]
}

我也得到了像这种类型（1）、大小（0）这样的数据作为道具。那么我怎样才能创建这样的新对象呢？：

item = {
  id: 0
  name: "example1"
  price: 15
  size: 10
  type: "two"
}

【问题讨论】：

您可以将值分配给一个新对象，或者您的问题到底是什么？
您是只想通过多个参数找到一个项目，还是实际上想要返回一个删除了其他数组属性的新对象引用？
好吧，如果更容易的话，通过多个参数找到一个项目会很棒。我该怎么做？

标签： javascript reactjs

【解决方案1】：

我只是格式化新对象。

let item = items.find((item) => item.id === id)
let formattedItem = {
    id: item.id,
    name: item.name
    price: item.price
    size: item.sizes[0]
    type: item.types[0]
}

我还会检查 sizes 是否是一个有效的数组，例如

type: item.types.length ? item[0] : null

【讨论】：

所以，David Lacedonia，正如我理解的那样，如果我收到 size 并以动态方式输入，我可以使用 for size: item.sizes[size] 和 for type: item.types[type]?
没错，是的！ ...并且不要忘记检查类型/大小是否为有效数组，否则会抛出错误，因为您无法访问未定义的 [type]（例如）
array::find 可以返回 undefined 所以记得在尝试访问 id、name、price、sizes 和 @987654328 之前检查返回的 item 是否为真@ 属性。

【解决方案2】：

您不应该使用硬编码索引来获取客户端中的值，这应该只在服务器端处理，但如果您想让它工作，它会这样做。如果你想要 type[1] 和 size[0]，你可以使用 map() 来构造你的结果对象。

let addedItem = items.find((item) => item.id === id).map(x => {
     return {
        id: x.id,
        name: x.name,
        price: x.price,
        size: x.size[0],
        type: x.type[1]
     })

【讨论】：

Singh，我收到类型和尺寸作为道具（类型（1），尺寸（0） - 只是我收到的示例）
知道了，因此您可以使用变量而不是硬编码值（type[1] 和 size[0] 到 type[type_index] 和 size[size_index]），但 map() 是应该可以解决您的问题。如果解决方案有效，请标记它。
Singh，如果我不想按句柄列出所有参数，如何创建新对象？
它不起作用 - items.find().map 不是一个函数。我认为因为 items.find() 返回一个对象（不是数组）
你可以使用 filter() 代替 find()

【解决方案3】：

嗯，谢谢大家。我的回答：

let item = items.find((item) => item.id === id)
let formattedItem = {
    ...item,
    size: item.sizes[size]
    type: item.types[type]
}

【讨论】：