Javascript ES6 / ES5 trova in array e cambia

Ho una serie di oggetti. Voglio trovare un campo e poi cambiarlo:

var item = {...}
var items = [{id:2}, {id:2}, {id:2}];

var foundItem = items.find(x => x.id == item.id);
foundItem = item;

Voglio che cambi l'oggetto originale. Come? (Non mi importa se sarà anche in lodash)

È possibile utilizzare findIndex per trovare l'indice nella matrice dell'oggetto e sostituirlo come richiesto:

var item = {...}
var items = [{id:2}, {id:2}, {id:2}];

var foundIndex = items.findIndex(x => x.id == item.id);
items[foundIndex] = item;

Ciò presuppone ID univoci. Se i tuoi ID sono duplicati (come nel tuo esempio), probabilmente è meglio se usi per ogni:

items.forEach((element, index) => {
    if(element.id === item.id) {
        items[index] = item;
    }
});

Il mio approccio migliore è:

var item = {...}
var items = [{id:2}, {id:2}, {id:2}];

items[items.findIndex(el => el.id === item.id)] = item;

Riferimento per findIndex

E nel caso in cui non si desideri sostituire con un nuovo oggetto, ma invece di copiare i campi di item, è possibile utilizzare Object.assign:

Object.assign(items[items.findIndex(el => el.id === item.id)], item)

in alternativa con .map():

Object.assign(items, items.map(el => el.id === item.id? item : el))

Approccio funzionale :

Non modificare l'array, utilizzane uno nuovo, in modo da non generare effetti collaterali

const updatedItems = items.map(el => el.id === item.id ? item : el)

Un altro approccio è utilizzare la giunzione .

Il splice()metodo modifica il contenuto di un array rimuovendo o sostituendo elementi esistenti e / o aggiungendo nuovi elementi in atto .

NB: Nel caso in cui lavori con framework reattivi, aggiornerà la "vista", il tuo array "saprà" che lo hai aggiornato.

Risposta :

var item = {...}
var items = [{id:2}, {id:2}, {id:2}];

let foundIndex = items.findIndex(element => element.id === item.id)
items.splice(foundIndex, 1, item)

E nel caso in cui desideri modificare solo un valore di un articolo, puoi utilizzare la funzione find :

// Retrieve item and assign ref to updatedItem
let updatedItem = items.find((element) => { return element.id === item.id })

// Modify object property
updatedItem.aProp = ds.aProp

Dato un oggetto modificato e un array:

const item = {...}
let items = [{id:2}, {id:3}, {id:4}];

Aggiorna l'array con il nuovo oggetto ripetendo l'array:

items = items.map(x => (x.id === item.id) ? item : x)

Può essere utilizzare il filtro .

const list = [{id:0}, {id:1}, {id:2}];
let listCopy = [...list];
let filteredDataSource = listCopy.filter((item) => {
       if (item.id === 1) {
           item.id = 12345;
        }

        return item;
    });
console.log(filteredDataSource);

Array [Oggetto {id: 0}, Oggetto {id: 12345}, Oggetto {id: 2}]

ha funzionato per me

let returnPayments = [ ...this.payments ];

returnPayments[this.payments.findIndex(x => x.id == this.payment.id)] = this.payment;

Considerando che la maggior parte delle risposte esistenti sono ottime, vorrei includere una risposta usando un ciclo for tradizionale, che dovrebbe essere considerato anche qui. L'OP richiede una risposta compatibile ES5 / ES6 e si applica il tradizionale ciclo per :)

Il problema con l'uso delle funzioni di matrice in questo scenario è che non mutano oggetti, ma in questo caso la mutazione è un requisito. Il guadagno in termini di prestazioni derivante dall'uso di un ciclo tradizionale for è solo un (enorme) bonus.

const findThis = 2;
const items = [{id:1, ...}, {id:2, ...}, {id:3, ...}];

for (let i = 0, l = items.length; i < l; ++i) {
  if (items[i].id === findThis) {
    items[i].iAmChanged = true;
    break;
  }
}

Anche se sono un grande fan delle funzioni di array, non lasciarli essere l'unico strumento nella tua casella degli strumenti. Se lo scopo è la mutazione dell'array, non sono la soluzione migliore.

One-liner utilizzando l'operatore di diffusione.

 const updatedData = originalData.map(x => (x.id === id ? { ...x, updatedField: 1 } : x));