How to find and replace an object with in array of objects

Question

I have an array of objects like this.

 [{
    "id": 1,
    "name": "January",
    "abc": abc,
    "xyz": xyz
}, {
    "id": 2,
    "name": "February",
    "abc": abc,
    "xyz": xyz
}]

I want to replace the object which is having id 2 with the different object and i want to have my object like this .

 [{
    "id": 1,
    "name": "January",
    "abc": abc,
    "xyz": xyz
}, {
    "id": 2,
    "name": "New month",
    "abc": 1234abc,
    "xyz": someVlaue
}]

how to do it in efficient way in typescript or javascript.

score 5 · Answer 1 · answered Feb 18 '22 at 06:48

Different ways to achieve this.

By using Object.assign() method. It returns the modified target object.

const data = [{
    "id": 1,
    "name": "January",
    "abc": "abc",
    "xyz": "xyz"
}, {
    "id": 2,
    "name": "February",
    "abc": "abc",
    "xyz": "xyz"
}];

const target = data.find((obj) => obj.id === 2);

const source = {
  id: 2,
  name: 'New Month',
  abc: 'abc123',
  xyz: 'someValue'
};

Object.assign(target, source);

console.log( data );

By using array.map() method which creates a new array populated with the results of calling a provided function on every element in the calling array.

const data = [{"id": 1,"name": "January","abc": "abc","xyz": "xyz"}, {"id": 2,"name": "February","abc": "abc","xyz": "xyz"}];

const modifiedObj = {"id": 2,"name": "New month","abc": "1234abc","xyz": "someVlaue"};

const result = data.map((item) => item.id === modifiedObj.id ? modifiedObj : item);

console.log(result);

score 1 · Answer 2 · answered Feb 17 '22 at 19:38

Looks like this was explained well in this post. The top answer explained how to use find(), as well as findIndex(). Should help you achieve what you are looking to do.

Find object by id in an array of JavaScript objects

EDIT: Forgot about the replacement piece.

Replace a particular object based on id in an array of objects in javascript

JS Chewy · Answer 3 · 2022-02-17T20:00:04.193

1

const arr =  [{
  "id": 1,
  "name": "January",
  "abc": "abc",
  "xyz": "xyz"
}, {
  "id": 2,
  "name": "February",
  "abc": "abc",
  "xyz": "xyz"
}]

const index = arr.findIndex(entry => entry.id === 2);
arr[index] = {id: 2, name: "New month", abc: "1234abc", xyz: "someVlaue"} // (sic)

edited Feb 17 '22 at 20:00

answered Feb 17 '22 at 19:41

JS Chewy

71
3

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Feb 17 '22 at 20:02

score 1 · Answer 4 · answered Feb 17 '22 at 20:21

You can use Object.assign() with find() as follows:

const data = [{
    "id": 1,
    "name": "January",
    "abc": "abc",
    "xyz": "xyz"
}, {
    "id": 2,
    "name": "February",
    "abc": "abc",
    "xyz": "xyz"
}];

Object.assign(
    //find the desired object
    data.find(({id,name,abc,xyz}) => id === 2),
    //pass these new values 
    {name:"New Month",abc:"abc123",xyz:"someValue"}
);

console.log( data );

score 1 · Answer 5 · answered Feb 18 '22 at 05:25

Another way to replace the object:

const data = [{"id": 1,"name": "January","abc": "abc","xyz": "xyz"}, {"id": 2,"name": "February","abc": "abc","xyz": "xyz"}];

const newObj = {"id": 2,"name": "New month","abc": "1234abc","xyz": "someVlaue"};
const targetId = 2;

const result = data.map((obj) => obj.id === targetId ? newObj : obj);
console.log(result);

.as-console-wrapper{min-height: 100%!important; top: 0}

score 0 · Answer 6 · answered Feb 17 '22 at 20:43

Assign works, but you can also just use find then update the value. If your data structure is exactly like you have it, then assign will work if you dont want to mutate the original value. However, if you have objects as any of the values then you might as well use this approach unless you want to also do a deep copy of the entire object before changing it.

const data = [{
    "id": 1,
    "name": "January",
    "abc": "abc",
    "xyz": "xyz"
}, {
    "id": 2,
    "name": "February",
    "abc": "abc",
    "xyz": "xyz"
}];

const element = data.find(el => el.id === 2)
element.xyz = "WHATERVER"
console.log(data)

How to find and replace an object with in array of objects

6 Answers6