Elementa maiņa pēc id JavaScript

Lai mainīgajā arr atrodas objektu masīvs:

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',
	},
];

Pieņemsim, ka mēs vēlamies mainīt kādu masīva elementu. Lai jaunie dati tiek glabāti mainīgajā, piemēram, šādi:

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

Dotajā objektā id sakrīt ar id otra masīva elementa, bet īpašību vērtības ir citas. Citiem vārdiem sakot, data īpašībā id mums tiek glabāts tā masīva elementa id, kuru mēs vēlamies mainīt.

Izpildīsim šo izmaiņu. Lai to izdarītu, mēs atkārtosim masīva elementus ar ciklu un, ja id sakrīt ar meklējamo, veiksim elementa aizstāšanu, bet, ja nesakrīt, atstāsim elementu nemainītu:

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

Kodu var saīsināt, izmantojot ternāro operatoru:

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

Lai mainīgajā tiek glabāts masīva elementa id. Izveidojiet pogu, kurai noklikšķinot tiks mainīts atbilstošais masīva elements.