Javascript ES6 ES5 find in array and change

Question

I have an array of objects  I want to find by some field  and then to change it   var item         var items     id 2    id 2    id 2     var foundItem   items find x   gt  x id    item id   foundItem   item    I want it to change the original object  How   I dont care if it will be in lodash too

User · Answer

worked for me     let returnPayments        this payments     returnPayments this payments findIndex x   gt  x id    this payment id     this payment

User · Answer

You can use findIndex to find the index in the array of the object and replace it as required   var item         var items     id 2    id 2    id 2     var foundIndex   items findIndex x   gt  x id    item id   items foundIndex    item    This assumes unique IDs  If your IDs are duplicated  as in your example   it s probably better if you use forEach   items forEach  element  index    gt        if element id     item id            items index    item

User · Answer

My best approach is   var item         var items     id 2    id 2    id 2     items items findIndex el   gt  el id     item id     item    Reference for findIndex  And in case you don t want to replace with new object  but instead to copy the fields of item  you can use Object assign   Object assign items items findIndex el   gt  el id     item id    item   as an alternative with  map     Object assign items  items map el   gt  el id     item id  item   el    Functional approach   Don t modify the array  use a new one  so you don t generate side effects  const updatedItems   items map el   gt  el id     item id   item   el

User · Answer

Whereas most of the existing answers are great  I would like to include an answer using a traditional for loop  which should also be considered here  The OP requests an answer which is ES5 ES6 compatible  and the traditional for loop applies     The problem with using array functions in this scenario  is that they don t mutate objects  but in this case  mutation is a requirement  The performance gain of using a traditional for loop is just a  huge  bonus   const findThis   2  const items     id 1         id 2         id 3          for  let i   0  l   items length  i  lt  l    i      if  items i  id     findThis        items i  iAmChanged   true      break          Although I am a great fan of array functions  don t let them be the only tool in your toolbox  If the purpose is mutating the array  they are not the best fit

User · Answer

Given a changed object and an array   const item         let items     id 2    id 3    id 4      Update the array with the new object by iterating over the array   items   items map x   gt   x id     item id    item   x

User · Answer

May be use Filter   const list     id 0    id 1    id 2    let listCopy       list   let filteredDataSource   listCopy filter  item    gt           if  item id     1               item id   12345                     return item          console log filteredDataSource        Array  Object   id  0    Object   id  12345    Object   id  2

User · Answer

An other approach is to use splice      The splice   method changes the contents of an array by removing or replacing existing elements and or adding new elements in place    N B   In case you re working with reactive frameworks  it will update the  view   your array  knowing  you ve updated it   Answer     var item         var items     id 2    id 2    id 2     let foundIndex   items findIndex element   gt  element id     item id  items splice foundIndex  1  item    And in case you want to only change a value of an item  you can use find function        Retrieve item and assign ref to updatedItem let updatedItem   items find  element    gt    return element id     item id        Modify object property updatedItem aProp   ds aProp

User · Answer

One-liner using spread operator     const updatedData   originalData map x   gt   x id     id        x  updatedField  1     x

[javascript] Javascript ES6/ES5 find in array and change

Examples related to javascript

Examples related to arrays

Examples related to ecmascript-6

Examples related to lodash