Convert Object property value into float

Question

I have the following data structure:

    const data = [
     {a: '12.03', b: '2.45', c: '24.12'},
     {a: '12.03', b: '22.45', c: '44.12'},
     {a: '15.03', b: '12.45', c: '24.12'},
     .
     .
     .
     n
    ]

And I want to convert the string into a float:

const data = [
     {a: 12.03, b: 2.45, c: 24.12},
     {a: 12.03, b: 22.45, c: 44.12},
     {a: 15.03, b: 12.45, c: 24.12}
    ]

Any Idea on how to iterate over the object and just apply the format so I can use the data array in a line chart?

Simplest is the unary `+` operator: `data.forEach(obj => Object.keys(obj).forEach(key=>obj[key]=+obj[key])); `. — RobG, Oct 08 '18 at 22:25

Jonas Wilms · Accepted Answer · 2018-10-08T22:21:24.430

5

 data = data.map(({ a, b, c }) => ({ a: parseFloat(a), b: parseFloat(b), c: parseFloat(c) }));

or more general:

 data = data.map(entry => 
   Object.entries(entry).reduce(
       (obj, [key, value]) => (obj[key] = parseFloat(value), obj), 
       {}
   )
 );

edited Oct 08 '18 at 22:21

answered Oct 08 '18 at 21:58

Jonas Wilms

132,000
20
149
151

Your making people horizontally scroll, just so that it's a one-liner.. :) – Keith Oct 08 '18 at 22:09
Thanks for your help. I got it working with the more general solution. Thanks alot! – Emmanuel Oct 08 '18 at 22:43

Robin Zigmond · Answer 2 · 2018-10-08T22:30:52.590

2

Everyone seems to want to use parseFloat, but I personally think it's just as readable, as well as much more concise/idiomatic, to use the unary +:

data.map(obj => ({a: +obj.a, b: +obj.b, c: +obj.c}));

I guess I'm in the minority, but I'll leave this here anyway in case this is useful to someone.

edited Oct 08 '18 at 22:30

answered Oct 08 '18 at 22:14

Robin Zigmond

17,805
2
23
34

Matt Way · Answer 3 · 2018-10-09T00:37:46.423

1

Personally I would use lodash mapValues for this.

const parsed = data.map(item => _.mapValues(item, parseFloat))

This simply takes each item, and iterates over the keys, changing the value using parseFloat. Compared to the reduce method, this is much more readable, and less prone to bugs as you aren't reinventing the wheel.

edited Oct 09 '18 at 00:37

answered Oct 08 '18 at 22:01

Matt Way

32,319
10
79
85

score 1 · Answer 4 · answered Oct 08 '18 at 22:14

You can accomplish this with some simple for loops.

const data = [
 {a: '12.03', b: '2.45', c: '24.12'},
 {a: '12.03', b: '22.45', c: '44.12'},
 {a: '15.03', b: '12.45', c: '24.12'},
];

//Loop through each array
for (var arr in data){
//Loop through eact data point
        for (var point in data[point]){
    //Convert to float
            data[point][i] = parseFloat(data[point][i])
    }
}

score 0 · Answer 5 · answered Oct 08 '18 at 21:57

0

You can use javascript parseFloat() to convert a string into a float.

parseFloat('12.03')

returns

12.03

answered Oct 08 '18 at 21:57

michele

23
5

score 0 · Answer 6 · answered Oct 08 '18 at 21:58

0

You can map over each of the data items and transform them into your desired format:

const result = data.map(value => ({ 
  a: parseFloat(value.a), 
  b: parseFloat(value.b), 
  c: parseFloat(value.c) 
});

answered Oct 08 '18 at 21:58

Tsvetan Ganev

8,246
4
26
43

Teh SoTo · Answer 7 · 2018-10-08T22:53:11.860

0

You run a function through every element of the array with .map (every object), then if you don't know the keys or the amount of keys, you can loop through each of the object's key with Object.keys(el), and then using parseFloat to do the trick.

data.map((el) => {
  Object.keys(el).forEach((key) => {
      el[key] = parseFloat(el[key])
  })
})

edited Oct 08 '18 at 22:53

answered Oct 08 '18 at 22:10

Teh SoTo

209
1
10

Please add some explanation. Code only answers are discouraged and will be deleted eventually. – Pritam Banerjee Oct 08 '18 at 22:48

Convert Object property value into float

7 Answers7