How to change data in a nested JSON by javascript lodash

user_16278772 0
Viewed 601

for example, i have a JSON file like this

{
  "employees": [
    { "name": "Ram", "email": "ram@gmail.com", "age": 23 },
    { "name": "Shyam", "email": "shyam23@gmail.com", "age": 28 },
    { "name": "John", "email": "john@gmail.com", "age": 33 },
    { "name": "Bob", "email": "bob32@gmail.com", "age": 33 }
  ]
}

Now i want to create a new array that same as this, but modded specific value, like if age is 33 then change to 1, like

{
  "employees": [
    { "name": "Ram", "email": "ram@gmail.com", "age": 23 },
    { "name": "Shyam", "email": "shyam23@gmail.com", "age": 28 },
    { "name": "John", "email": "john@gmail.com", "age": 1 },
    { "name": "Bob", "email": "bob32@gmail.com", "age": 1 }
  ]
}

How can i do this with lodash or javascript array ? Thank you guy a lots

lodash reactjs javascript
3 Answers

In order to create a new array you need to take care not to modify the existing elements of the array. You can do this in a number of ways, however because your data is multiple levels, using functions like Array.map() or the Spread operator (...) can be problematic. You need to copy the data first. One way is using JSON.stringify() and JSON.parse() to create the copy, then modify it using an Array maniulation method (.map(), .reduce(), .forEach(), etc) to modify the data.

var data = {
  employees: [
    { name: "Ram", email: "ram@gmail.com", age: 23 },
    { name: "Shyam", email: "shyam23@gmail.com", age: 28 },
    { name: "John", email: "john@gmail.com", age: 33 },
    { name: "Bob", email: "bob32@gmail.com", age: 33 }
  ]
}

var copy = JSON.parse(JSON.stringify(data))
copy.employees.map( elem => { elem.age = elem.age==33?1:elem.age; return elem } )
console.log(copy)

user_24875170

Map is the good way to do it, but if it is nested somewhere in an object you can also add the spread operator:

const object = { 
  employees: [
    { name: "Ram", email: "ram@gmail.com", age: 23 },
    { name: "Shyam", email: "shyam23@gmail.com", age: 28 },
    { name: "John", email: "john@gmail.com", age: 33 },
    { name: "Bob", email: "bob32@gmail.com", age: 33 },
  ]
}
const employees = object.employees.map((employee) => {
  employee.age = employee.age === 33 ? 1 : employee.age; 
  return employee
})
const newObject = {
  ...object,
  employees: employees
}

console.log(newObject)

user_166459900

as @Tibrogargan mentioned this answer is not good if you need to do a deep copy because map function doing a shallow copy more about that and more ways to do deep copy you can see here https://javascript.plainenglish.io/how-to-deep-copy-objects-and-arrays-in-javascript-7c911359b089#:~:text=4.,objects%20are%20not%20actually%20cloned.

it might be not good for you Please check Tibrogargan answer

you can use map method of Javascript

  let data = {
    employees: [
      { name: "Ram", email: "ram@gmail.com", age: 23 },
      { name: "Shyam", email: "shyam23@gmail.com", age: 28 },
      { name: "John", email: "john@gmail.com", age: 33 },
      { name: "Bob", email: "bob32@gmail.com", age: 33 },
    ],
  };
  let newArray = data.employees.map((emp) => {
    if (emp.age == 33) emp.age = 1;
    return emp;
  });
  console.log(newArray);

more about map function https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

user_83255820
Related