Промена на елемент по id во JavaScript

Нека во променливата arr лежи низа од објекти:

let arr = [
	{
		id: 'GYi9GauC4gBF1e2SixDvu',
		prop1: 'value11',
		prop2: 'value12',
		prop3: 'value13',
	},
	{
		id: 'IWSpfBPSV3SXgRF87uO74',
		prop1: 'value21',
		prop2: 'value22',
		prop3: 'value23',
	},
	{
		id: 'JAmjRlfQT8rLTm5tG2m1L',
		prop1: 'value31',
		prop2: 'value32',
		prop3: 'value33',
	},
];

Нека сакаме да смениме некој елемент од низата. Нека новите податоци се чуваат во променлива, на пример, вака:

let data = {
	id: 'IWSpfBPSV3SXgRF87uO74',
	prop1: 'value21 !',
	prop2: 'value22 !',
	prop3: 'value23 !',
};

Во дадениот објект id совпаѓа со id на вториот елемент од низата, а вредностите на својствата се различни. Со други зборови, во data во својството id ни се чува id на оној елемент од низата што сакаме да го смениме.

Ајде да ја извршиме оваа промена. За ова ќе ги прелистуваме елементите од низата со циклус и, ако id совпаѓа со бараниот, ќе извршиме замена на елементот, а ако не совпаѓа, ќе го оставиме елементот непроменет:

let res = arr.map(elem => {
	if (elem.id === data.id) {
		return data;
	} else {
		return elem;
	}
});

Може да се скрати кодот, користејќи тернарен оператор:

let res = arr.map(elem => elem.id === data.id ? data : elem);

Нека во променлива се чува id на елемент од низата. Направете копче, при кликнување на кое ќе се смени соодветниот елемент од низата.