How to convert an array with one object and multiple keys into an array of multiple objects using those keys and their values?

Question

I have an array like so with a single object inside:

FirstArray = [{
    "category": "None",
    "ARFE": 553.5,
    "BV": 900,
    "RF rfeer": 0,
    .....
}]

I want to convert it so that every key-value pair (where the value is a number) in the object is in its own object like the following:

NewArray = [{
  name: "ARFE",
  value: 553.05
}, {
  name: "BV",
  value: 900
}, {
  name: "RF rfeer",
  value: 0
}, .....]

Here, each key was assigned a new key called name, and the value for the original key was assigned a new key called value. Those pairs are then put into their own object inside the array.

Note that "category": "None" is not its own object in the array since "None" is non-numerical.

It's also important to note that there could be many key-value pairs, so it's not just limited to the items above (e.g., "ARFE": 553.5, etc.)

What I have so far:

I know you can separate a single object into multiple objects:

NewArray = Object.entries(FirstArray).reduce((prev, [og, nw]) => {
    let [name, value] = og.match(/\D+|\d+$/g)
    prev[value] = { ...(prev[value] || {}), [name]: nw }
    return prev;
 }, {})

I also know how that you can create a new object with new keys like so:

NewArray = Object.assign(
    ...Object.entries(FirstArray).map(([key, value]) => ({ [key]: name }))
);

However, I'm having trouble putting everything together. How would I be able to achieve NewArray from FirstArray?

There is no JSON involved in this question. Please do not use the tag when discussing plain JavaScript objects. I've removed the tag from your question. — Heretic Monkey, Aug 23 '22 at 14:27
Does this answer your question? [How to transpose a javascript object into a key/value array](https://stackoverflow.com/questions/36411566/how-to-transpose-a-javascript-object-into-a-key-value-array) — Heretic Monkey, Aug 23 '22 at 14:28

Cerbrus · Accepted Answer · 2022-08-23T14:32:40.337

2

You were pretty close. All you needed to do is specify the name:

const data = {
    "category": "None",
    "ARFE": 553.5,
    "BV": 900,
    "RF rfeer": 0
};

const result = Object
    .entries(data)
    .filter(([_, value]) => typeof value === 'number')
    .map(([key, value]) => ({ name: key, value }));

console.log(result);

Also, if you don't want { "name": "category", "value": "None" } to be included in the result, you can just filter it:

const result = Object
    .entries(data)
    .filter(([ key ]) => key !== 'category')
    .map(([key, value]) => ({ name: key, value }));

edited Aug 23 '22 at 14:32

answered Aug 23 '22 at 14:24

Cerbrus

70,800
18
132
147

That works really well! Though I wrote that any key-value pair where the value is non-numerical (like "category": "None") have to be excluded from the final array. In such a case, would that require a foreach that encompasses all of the const result? – naru-magi Aug 23 '22 at 14:31
@naru-magi: No, that can be filtered as well. I've updated my answer. – Cerbrus Aug 23 '22 at 14:33

score 0 · Answer 2 · answered Aug 23 '22 at 14:25

0

Object.entries on array has no sense at all, use it on the object

const FirstArray = [{
  "category": "None",
  "ARFE": 553.5,
  "BV": 900,
  "RF rfeer": 0,
}]

const newObject = Object.entries(FirstArray[0]).reduce((array, [key, value]) => {
  return [...array, {
    name: key,
    value
  }]
}, [])

console.log(newObject)

answered Aug 23 '22 at 14:25

Konrad

21,590
4
28
64

Why are you using `reduce` to build the new array? – Cerbrus Aug 23 '22 at 14:27
Just by a mistake but it shows what op did wrong more clearly – Konrad Aug 23 '22 at 15:45

score 0 · Answer 3 · answered Aug 23 '22 at 14:32

0

reduce is not the right way to go. Simply use map:

Object.entries(FirstArray[0])
    .filter(x => !isNaN(x[1]))    // filter out non-numeric values
    .map(([name, value]) => ({name, value}))

answered Aug 23 '22 at 14:32

albjerto

409
2
12

How to convert an array with one object and multiple keys into an array of multiple objects using those keys and their values?

3 Answers3