Поменять значение в массиве объектов по заданному id?

Question

[ByJumping]

Есть исходный объект который нужно будет мутировать -

const directions = [
{color: 'red', value: 235, id: 1},
{color: 'red', value: 5, id: 2},
{color: 'red', value: 2456, id: 3},
{color: 'red', value: 5328, id: 4},
{color: 'red', value: 43, id: 5},
]

есть объект с id который соответствует id в начальном массиве

const itemWithNewColor = {
id: 3,
title: 'random title',
color: 'white',
}

Нужно сопоставить id из itemWithNewColor с directions. И если id совпадают то менять color в этом элементе, то есть что бы по итогу мы получили

directions = [
{color: 'red', value: 235, id: 1},
{color: 'red', value: 5, id: 2},
{color: 'blue', value: 2456, id: 3}, // поменяли color по id
{color: 'red', value: 5328, id: 4},
{color: 'red', value: 43, id: 5},
]

по итогу мы поменяли только 1 элемент, если передали бы несколько объектов с id то так же бы им поменяли color

делаю

for (const item of directions) {
if(item.id === itemWithNewColor.id) {
item.color = itemWithNewColor.color
}
}

и вроде даже работает, но уверен, что есть способ проще и более универсальный если будет не 1 объект с цветом, а например, несколько и у всех понадобится поменять color

Answer 1

[0xD34F]

function update(target, source, key, props) {
  source.forEach(function(n) {
    const item = this[n[key]];
    item && props.forEach(m => item[m] = n[m]);
  }, Object.fromEntries(target.map(n => [ n[key], n ])));
}


update(directions, [ { раз объект }, { два объект }, ... ], 'id', [ 'color' ]);