JavaScript में id के द्वारा एलिमेंट बदलना

मान लीजिए वेरिएबल arr में ऑब्जेक्ट्स की एक array है:

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

मान लीजिए हम array के किसी एलिमेंट को बदलना चाहते हैं। मान लीजिए नया डेटा एक वेरिएबल में है, उदाहरण के लिए, इस प्रकार:

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

दिए गए ऑब्जेक्ट में id array के दूसरे एलिमेंट के id से मेल खाता है, जबकि प्रॉपर्टीज़ के वैल्यूज़ - अलग हैं। दूसरे शब्दों में कहें तो data की id प्रॉपर्टी में उस array एलिमेंट का id है जिसे हम बदलना चाहते हैं।

आइए यह बदलाव करें। इसके लिए हम array के एलिमेंट्स को लूप से इटरेट करेंगे और, यदि 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);

मान लीजिए एक वेरिएबल में array के किसी एलिमेंट का id स्टोर है। एक बटन बनाएं, जिसके क्लिक करने पर संबंधित एलिमेंट array में बदल जाए।