使用展开运算符的一行程序。

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

使用展开运算符的一行程序。

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

你可以使用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;
    }
});

我还没有在答案中看到这种方法，所以这里有一个简单的小代码

let item = {id: 1, new: true};
let items = [{id: 1}, {id: 2}];

let replaced = [item, ...items.filter(i => i.id !== item.id)]

您只是将项目添加到要替换的项目筛选的原始数组中。

我最好的方法是:

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

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

findIndex的引用

如果你不想用new object替换，而是复制item的字段，你可以使用object .assign:

对象分配(项目[项目。findIndex(el => el)id ===项目。

作为.map()的替代:

对象。分配(项目,项目。地图(el => el)id ===项目。id?项目:el)

功能的方法:

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

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

Note

如果使用得当，对对象的引用不会丢失，因此您甚至可以使用原始的对象引用，而不是创建新的对象引用。

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内容，这将修改列表的元素，然后我们需要更新列表并将其作为列表发送回数据库。

Good news is, references are kept, so you could organize your code to get advantage of it, and think about a list as an Object with identities for free, which are integers from 0 to length -1. So every time you access any property of your Object, do it as list[i], and you don't lose reference, and original object is changed. Keep in mind that this is useful when your source of truth is only one (the Object created), and your app is always consistently consuming the same Object (not fetching several times from database and assigning it to list along the lifespan of the component).

坏消息是架构是错误的，如果这是您所需要的，您应该通过ids(字典)接收一个对象，例如

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

这样，就不用在数组中搜索，这会消耗资源。你“只是通过对象中的键访问”，这是即时的和性能的。

另一种方法是使用拼接。

splice()方法通过删除或替换现有元素和/或在适当位置添加新元素来更改数组的内容。

注意:如果你正在使用响应式框架，它会更新“视图”，你的数组“知道”你已经更新了它。

答:

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

let foundIndex = items.findIndex(element => element.id === item.id)
items.splice(foundIndex, 1, item)

如果你只想改变一个项的值，你可以使用find函数:

// Retrieve item and assign ref to updatedItem
let updatedItem = items.find((element) => { return element.id === item.id })

// Modify object property
updatedItem.aProp = ds.aProp