Question

我有一个如下所示的对象数组：

const items = [
  {_id: "Tk2dc3fq99qZ7YdQQ", parent: "Dn59y87PGhkJXpaiZ", content: "one", context: "default"}
  {_id: "uK4MYJJGa6ra9e99v", parent: "Dn59y87PGhkJXpaiZ", content: "two", context: "default"}
]

注意：项目是只读的，因为它来自反应组件中的prop

我想通过这样的给定对象更新内容：

const changeThis = { _id: "uK4MYJJGa6ra9e99v", context: "info" }

因此具有匹配ID的对象应该将'info'作为新的上下文值，同时保留所有其他元素：

[
  {_id: "Tk2dc3fq99qZ7YdQQ", parent: "Dn59y87PGhkJXpaiZ", content: "one", context: "default"}
  {_id: "uK4MYJJGa6ra9e99v", parent: "Dn59y87PGhkJXpaiZ", content: "two", context: "info"}
]

另一个例子

和...

const changeThis = { _id: "uK4MYJJGa6ra9e99v", context: "info", content: "new" }

...应该改变匹配对象的上下文和内容：

[
  {_id: "Tk2dc3fq99qZ7YdQQ", parent: "Dn59y87PGhkJXpaiZ", content: "one", context: "default"}
  {_id: "uK4MYJJGa6ra9e99v", parent: "Dn59y87PGhkJXpaiZ", content: "new", context: "info"}
]

我的尝试

首先，我会使用map()来遍历数组，但是如何使用changeThis - 对象更新所有其他字段？我尝试使用assign()和keys()，我试图忽略_id键：

items.map((item, index) => {
  if (item._id === changeThis._id) {
    Object.assign(
      {},
      ...Object.keys(item).map(k => (
        {
          [k]: changeThis.indexOf(k) > -1 && k !== '_id'
            ? changeThis[k]
            : item[k]
        }
    ))
  }
});

Answer 1

一个简单的功能就足够了;请注意，let需要使用var或const代替items; map不会在适当的位置编辑，而是返回一个新数组。你可以在适当的位置进行编辑，但我不一定会推荐它。

items = items.map(item => {
  return (item._id === changeThis._id) ?
    { ...item, ...changeThis } :
    item
});

将changeThis的内容传播到item键之后的对象中，changeThis中显示的任何键都将覆盖item中的键。来自任一对象的键非重复键也将出现在最终结果中。

JS：替换数组

1 个答案: