Modificarea unui element după id în JavaScript

Să presupunem că în variabila arr se află un tablou de obiecte:

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

Să presupunem că vrem să modificăm un element al tabloului. Să presupunem că noile date sunt stocate într-o variabilă, de exemplu, astfel:

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

În obiectul dat id coincide cu id celui de-al doilea element al tabloului, iar valorile proprietăților sunt diferite. Cu alte cuvinte, în data în proprietatea id este stocat id acelui element al tabloului pe care îl dorim să-l modificăm.

Să efectuăm această modificare. Pentru aceasta vom parcurge elementele tabloului cu un ciclu și, dacă id coincide cu cel căutat, vom efectua înlocuirea elementului, iar dacă nu coincide, vom lăsa elementul neschimbat:

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

Putem scurta codul, folosind operatorul ternar:

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