如何在对象数组中查找和更新值？

Question

我有一系列的对象。我想找一个字段，然后改变它：

var item = {...}
var items = [{id:2}, {id:2}, {id:2}];

var foundItem = items.find(x => x.id == item.id);
foundItem = item;

我想让它改变原来的对象。多么?(我不在乎它是否也会在洛达什。)

Answer 1

您可以使用findIndex在对象数组中查找索引，并根据需要替换它：

var item = {...}
var items = [{id:2}, {id:2}, {id:2}];

var foundIndex = items.findIndex(x => x.id == item.id);
items[foundIndex] = item;

这假设是唯一的ID。如果您的ID是重复的(如您的示例所示)，最好使用forEach：

items.forEach((element, index) => {
    if(element.id === item.id) {
        items[index] = item;
    }
});

Answer 2

我最好的办法是：

var item = {...}
var items = [{id:2}, {id:2}, {id:2}];

items[items.findIndex(el => el.id === item.id)] = item;

findIndex参考

如果您不想用新对象替换，而是要复制item的字段，则可以使用Object.assign

Object.assign(items[items.findIndex(el => el.id === item.id)], item)

作为.map()的替代方案

Object.assign(items, items.map(el => el.id === item.id? item : el))

功能法

不要修改数组，使用新的数组，这样就不会产生副作用

const updatedItems = items.map(el => el.id === item.id ? item : el)

备注

正确使用时，对对象的引用不会丢失，因此您甚至可以使用原始对象引用，而不是创建新的引用。

const myArr = [{ id: 1 }, { id: 2 }, { id: 9 }];
const [a, b, c] = myArr;
// modify original reference will change object in the array
a.color = 'green';
console.log(myArr[0].color); // outputs 'green'

此问题通常发生在从数据库中消费列表，然后映射列表以生成HTML内容以修改列表元素时，然后我们需要更新列表并将其作为列表发送回数据库。

好消息是，引用是保留的，因此您可以组织代码以利用它，并将list视为一个具有免费标识的对象，它是从0到length -1的整数。因此，每次您访问对象的任何属性时，都以list[i]的形式进行操作，并且不会丢失引用，并且原始对象将被更改。请记住，如果您的真实来源只有一个(创建的对象)，并且您的应用程序始终使用相同的对象(而不是从数据库获取几次并在组件的生命周期内将其分配给list )，这是非常有用的。

坏消息是体系结构是错误的，如果这是您所需要的，您应该通过if (字典)接收一个对象，比如

{ 
  1232: { id: 1232, ...},
  asdf234asf: { id: 'asdf234asf', ...},
  ...
}

这样，就不会在数组中搜索，这是资源消耗。您“只是通过对象中的键进行访问”，这是即时的和可执行的。

Answer 3

单列使用扩展操作符。

 const updatedData = originalData.map(x => (x.id === id ? { ...x, updatedField: 1 } : x));