How to update a json object request string values to NUMBER in REACT

Question

I have an json object array and I want to update the values from String to Number

Example JSON object

[
   {
      "atest":{
         "value":"0",
         "units":"sqft"
      },
      "etest":{
         "value":"70",
         "units":"inches"
      },
      "waveTest":"8",
      "db_test":{
         "value":"3.7",
         "units":"feet"
      },
      "erp_test":{
         "value":"0.97",
         "units":"feet"
      },
      "erfp_test":"5"
   },
   {
      "atest":{
         "value":"6",
         "units":"sqft"
      },
      "etest":{
         "value":"20",
         "units":"inches"
      },
      "waveTest":"2",
      "db_test":{
         "value":"8.6",
         "units":"feet"
      },
      "erp_test":{
         "value":"2.57",
         "units":"feet"
      },
      "erfp_test":"10"
   }
]

I want to update all the "value": "0" to "value": 0 Please let me know what steps I need to mutate the json object to be able to update every data after "value" to a NUMBER

I seen a simliar post (reference) but his data schema is different compared to mine.

Reference

What you need is a recursive function that deep replaces/updates each occurence of "value" key using parseInt to convert to number. Here is a solution for a similar problem — Alex
– Alex, Commented Jan 12, 2021 at 14:02

Jun · Accepted Answer · 2021-01-12 14:16:03Z

Here is the solution. I added comments to the code for understanding.

// original array
const arr = [
   {
      "atest":{
         "value":"0",
         "units":"sqft"
      },
      "etest":{
         "value":"70",
         "units":"inches"
      },
      "waveTest":"8",
      "db_test":{
         "value":"3.7",
         "units":"feet"
      },
      "erp_test":{
         "value":"0.97",
         "units":"feet"
      },
      "erfp_test":"5"
   },
   {
      "atest":{
         "value":"6",
         "units":"sqft"
      },
      "etest":{
         "value":"20",
         "units":"inches"
      },
      "waveTest":"2",
      "db_test":{
         "value":"8.6",
         "units":"feet"
      },
      "erp_test":{
         "value":"2.57",
         "units":"feet"
      },
      "erfp_test":"10"
   }
]

const newArr = arr.map(element => {
  // Object.keys get keys from object by array so you can loop by keys
  Object.keys(element).forEach(key => {
    // check value is exist and parse value string to int
    if (element[key].value) element[key].value = parseFloat(element[key].value)
  })
  // return parsed object to array
  return element
})

console.log(newArr)

Waleed Nasir · Accepted Answer · 2021-01-12 14:20:18Z

Try this update with Function or onClick

data = [
   {
      "atest":{
         "value":"0",
         "units":"sqft"
      },
      "etest":{
         "value":"70",
         "units":"inches"
      },
      "waveTest":"8",
      "db_test":{
         "value":"3.7",
         "units":"feet"
      },
      "erp_test":{
         "value":"0.97",
         "units":"feet"
      },
      "erfp_test":"5"
   },
   {
      "atest":{
         "value":"6",
         "units":"sqft"
      },
      "etest":{
         "value":"20",
         "units":"inches"
      },
      "waveTest":"2",
      "db_test":{
         "value":"8.6",
         "units":"feet"
      },
      "erp_test":{
         "value":"2.57",
         "units":"feet"
      },
      "erfp_test":"10"
   }
]
updateData=(index,name,UpdateValue,target)=>{
//index means acces to object 0,1 or etc
//name means target the this object you want to update value
//UpdateValue is new value
//target means which variable you want to update

data[index][name][target] = UpdateValue
}

//example
////example
data.map((items,index)=>(Object.keys(items).map(item=>
updateData(index,item,Math.random(),'value')
)))

console.log(data,'New')

Mehdi Belbal · Accepted Answer · 2021-01-12 14:21:10Z

0

if the structure of your objects are always the same its as simple as that:

for(let el of arr) 
   for(let key in elem) 
      if(el[key].value) el[key].value = parseFloat(el[key].value)

answered Jan 12, 2021 at 14:21

Mehdi Belbal

5533 silver badges7 bronze badges

Collectives™ on Stack Overflow

How to update a json object request string values to NUMBER in REACT

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related