Modifica di una proprietà per id in JavaScript

Potresti aver bisogno di modificare non l'intero oggetto, ma una proprietà specifica. Vediamo come si fa.

Supponiamo che la variabile arr contenga un array di oggetti:

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

Supponiamo che le variabili contengano l'id dell'elemento, il nome della proprietà da modificare e il nuovo valore della proprietà:

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

Per risolvere il problema è conveniente usare la destrutturazione e nomi di proprietà calcolati:

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

Задание 1

Sono date le seguenti variabili:

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

Crea un pulsante che, quando cliccato, prenda l'elemento dell'array con l'id specificato, in esso prenda la proprietà con il nome specificato e alla fine del valore di questa proprietà venga aggiunto il simbolo '!'.

Задание 2

Supponiamo di avere due variabili con nomi di proprietà:

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

Modifica il compito precedente in modo che al click le modifiche vengano eseguite immediatamente per le due proprietà specificate.

Задание 3

Rielabora la soluzione fornita nella teoria utilizzando la copia dell'oggetto con Object.assign.