Как установить значения объекта в массиве с ES6?

Question

Я ищу самый быстрый и наиболее дружественный к ресурсам способ установки значений объекта внутри массива.Можно также использовать синтаксис ES6.

Итак, допустим, у меня есть этот массив объектов:

let group = [
    {
        id: 1,
        name: 'Test 1',
        geo: 'Japan',
        car: 'Toyota'
    },
    {
        id: 2,
        name: 'Test 2',
        geo: 'USA',
        car: 'Tesla'
    },
    {
        id: 3,
        name: 'Test 3',
        geo: 'Germany',
        car: 'Audi'
    }
];

И я хочу получить один из этих объектов на основе пользовательского ввода.Допустим, мы хотим получить индекс 3-го элемента по идентификатору Obejct:

let index = group.findIndex(g => g.id === payload.id);

Когда у меня есть индекс, я хочу присвоить этому объекту новые значения, например:

group[index].id = payload.id;
group[index].name = payload.name;
group[index].geo = payload.geo;
group[index].car = payload.car;

Однакоэто долго, безобразно, и представьте, если бы у вас было более 50 значений внутри этого объекта.

Вопрос: Есть ли более короткий и эффективный способ достижения того же самого?Включая также синтаксис ES6-ES7.

Answer 1

Приведенное выше решение является правильным, Вы также можете сделать то же самое, используя карту в одну строку (предпочитайте использовать функцию карты lodash).

let group = [{ id: 1, name: 'Test 1', geo: 'Japan', car: 'Toyota' }, { id: 2, name: 'Test 2', geo: 'USA', car: 'Tesla' }, { id: 3, name: 'Test 3', geo: 'Germany', car: 'Audi' }],
payload = { id: 3, name: 'update', geo: 'Germany Bavaria Ingolstadt', car: 'Audi 1' }; 

group = group.map((item) => item.id === payload.id ? payload : item);

Answer 2

el = group.find(g => g.id === payload.id);
if (el) { // add this 'if' if you are not sure if payload's id will be in group
  idx = group.indexOf(el);
  group[idx] = {...el, ...payload};
}

Answer 3

Использовать индексацию.Для одноразового поиска и обновления Array.find работает хорошо.Но если вам нужно обновить более одной записи, вам нужно создать индекс массива.

(function(){
    let group = [{ id: 1, name: 'Test 1', geo: 'Japan', car: 'Toyota' }, { id: 2, name: 'Test 2', geo: 'USA', car: 'Tesla' }, { id: 3, name: 'Test 3', geo: 'Germany', car: 'Audi' }],
        payload = { id: 3, name: 'update', geo: 'Germany Bavaria Ingolstadt', car: 'Audi 1' };
        
    let groupIndex = {};
    group.forEach(x => groupIndex[x.id]=x);

    let start = new Date().valueOf();
    let id = 1;
    let updates = 1000000;
    for(let i=0;i<updates;i++)
        if (groupIndex[id])
            Object.assign(groupIndex[id], payload);

    console.log(updates+" taken "+(new Date().valueOf()-start)+" ms");
})()

Answer 4

Вы можете использовать Array#find и Object.assign для изменения свойств найденного объекта.

var group = [{ id: 1, name: 'Test 1', geo: 'Japan', car: 'Toyota' }, { id: 2, name: 'Test 2', geo: 'USA', car: 'Tesla' }, { id: 3, name: 'Test 3', geo: 'Germany', car: 'Audi' }],
    payload = { id: 3, name: 'update', geo: 'Germany Bavaria Ingolstadt', car: 'Audi 1' },
    object = group.find(({ id }) => id === payload.id);

if (object) {
    Object.assign(object, payload);
}

console.log(group);

.as-console-wrapper { max-height: 100% !important; top: 0; }