Javascript ES6 / ES5在数组中查找并更改

时间:2016-02-04 16:17:41

标签: javascript arrays ecmascript-6 lodash

我有一个对象数组。 我希望通过某个领域找到,然后改变它:

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

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

我希望它能够改变原始对象。怎么样? (我不在乎它是否会在lodash中)

8 个答案:

答案 0 :(得分:132)

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

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

这假设是唯一的ID。如果您的ID重复(如您的示例所示),则使用forEach可能会更好:

USE EDIXML
GO
DECLARE @XML AS XML, @hDoc AS INT, @SQL NVARCHAR (MAX)
SELECT @XML = XMLData FROM XMLwithOpenXML
EXEC sp_xml_preparedocument @hDoc OUTPUT, @XML
SELECT  code,type,name,DE
FROM OPENXML(@hDoc, 'TRN-862/SEG-BSS/DE')
WITH 
(
code [varchar](100) '@code',
type [varchar](100) '@type',
name [varchar](100) '@name',
DE [varchar](100) '../DE'
)
EXEC sp_xml_removedocument @hDoc
GO

答案 1 :(得分:26)

My best approach is:

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

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

Reference for findIndex

And in case you don't want to replace with new object, but instead to copy the fields of item, you can use Object.assign:

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

as an alternative with .map():

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

答案 2 :(得分:9)

另一种方法是使用splice

  

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

N.B:如果你正在使用反应式框架,它会更新“视图”,你的阵列“知道”你已经更新了它。

答案:

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

答案 3 :(得分:5)

使用扩展运算符的单线。

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

答案 4 :(得分:4)

给出一个已更改的对象和一个数组:

const item = {...}
let items = [{id:2}, {id:3}, {id:4}];

通过遍历数组,用新对象更新数组:

items = items.map(x => (x.id === item.id) ? item : x)

答案 5 :(得分:3)

可以使用Filter

const list = [{id:0}, {id:1}, {id:2}];
let listCopy = [...list];
let filteredDataSource = listCopy.filter((item) => {
       if (item.id === 1) {
           item.id = 12345;
        }

        return item;
    });
console.log(filteredDataSource);
  

Array [对象{id:0},对象{id:12345},对象{id:2}]

答案 6 :(得分:0)

尽管大多数现有答案都很好,但我想使用传统的for循环来包含一个答案,此处也应考虑。 OP请求一个与ES5 / ES6兼容的答案,并且传统的for循环适用:)

在这种情况下使用数组函数的问题是它们不使对象突变,但是在这种情况下,必须进行突变。使用传统的for循环所带来的性能提升只是(巨大的)奖励。

const findThis = 2;
const items = [{id:1, ...}, {id:2, ...}, {id:3, ...}];

for (let i = 0, l = items.length; i < l; ++i) {
  if (items[i].id === findThis) {
    items[i].iAmChanged = true;
    break;
  }
}

尽管我非常喜欢数组函数,但不要让它们成为工具箱中的唯一工具。如果目的是使数组变异,则它们不是最合适的。

答案 7 :(得分:0)

为我工作

let returnPayments = [ ...this.payments ];

returnPayments[this.payments.findIndex(x => x.id == this.payment.id)] = this.payment;