Αλλαγή μιας ιδιότητας by 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',
	},
];

Ας υποθέσουμε ότι στις μεταβλητές αποθηκεύονται το id του στοιχείου, το όνομα της ιδιότητας για αλλαγή και η νέα τιμή της ιδιότητας:

let id = 'IWSpfBPSV3SXgRF87uO74';
let prop = 'prop1';
let value = '!!!';

Για την επίλυση του προβλήματος είναι βολικό να χρησιμοποιήσετε αποδόμηση (destructuring) και υπολογιζόμενα ονόματα ιδιοτήτων:

let res = arr.map(elem => {
	if (elem.id === id) {
		return {...elem, [prop]: value};
	} else {
		return elem;
	}
});

Δίνονται οι ακόλουθες μεταβλητές:

let id = 'JAmjRlfQT8rLTm5tG2m1L';
let prop = 'prop2';

Δημιουργήστε ένα κουμπί, upon click στο οποίο θα παίρνεται το στοιχείο του πίνακα με το καθορισμένο id, θα παίρνεται η ιδιότητα με το καθορισμένο όνομα και στο τέλος της τιμής αυτής της ιδιότητας θα προστίθεται το σύμβολο '!'.

Ας υποθέσουμε ότι δίνονται δύο μεταβλητές με ονόματα ιδιοτήτων:

let id = 'JAmjRlfQT8rLTm5tG2m1L';
let prop1 = 'prop2';
let prop2 = 'prop3';

Τροποποιήστε το προηγούμενο πρόβλημα έτσι ώστε upon click οι αλλαγές να εκτελούνται αμέσως για δύο καθορισμένες ιδιότητες.

Μετατρέψτε τη λύση που δόθηκε στη θεωρία χρησιμοποιώντας αντιγραφή αντικειμένου με τη βοήθεια του Object.assign.