How to convert an object to array of objects

Question

I have the following object :

let categories = {
  "Asset Type": ["appliances", "electronics"],
  "Asset Availability": ["in stock"]
}

I need to convert it to the following structure :

[
   {
     "name": "Asset Type",
     "values": ["Appliances", "Electronics"]
    }, 
    {
      "name": "Asset Availability",
      "values": ["In Stock"]
    }
]

Note that you can’t make any assumptions about the order of the resulting array elements. — Sebastian Simon, Apr 03 '18 at 11:30
@SebastianSimon If you want to be guaranteed by the spec, you can, but only if you use the right methods (like `Reflect.ownKeys`). If you just want the result to be *dependable*, you can use any of the object iteration methods - although the spec doesn't guarantee it, environments use the same algorithm anyway, luckily. (array indicies, followed by insertion order strings, followed by insertion order symbols) — CertainPerformance, Sep 25 '19 at 08:43

score 9 · Answer 1 · answered Apr 03 '18 at 11:05

9

Use Object.entries, array.prototype.map and some destructuring:

var categories = {
  "Asset Type": ["appliances", "electronics"],
  "Asset Availability": ["in stock"]
 };
 
var res = Object.entries(categories).map(([name, values]) => ({name, values}));

console.log(res);

answered Apr 03 '18 at 11:05

Faly

13,291
2
19
37

2

I found a duplicate target to this question, but this answer is more elegant than any other. – Sebastian Simon Apr 03 '18 at 11:43
Can you explain me why we have to surround the return object with `()` ? – GameTag Apr 03 '18 at 12:07
if its not surrounded by `()`. `{}` means the function body after fat arrow. so it will not treat it as object return. – atiq1589 Apr 03 '18 at 12:10
2

Without the (), javascript will interpret {} as a block, instead of object – Faly Apr 03 '18 at 12:10

Karim · Answer 2 · 2018-04-03T12:18:04.397

2

const categories =  {
  "Asset Type": ["appliances", "electronics"],
  "Asset Availability": ["in stock"]
 }

const toArray = obj => 
  Object.keys(obj).reduce((acc, key) => [...acc, {name: key, values: obj[key]}], [])

console.log(toArray(categories));

edited Apr 03 '18 at 12:18

answered Apr 03 '18 at 11:11

Karim

8,454
3
25
33

Larce · Answer 3 · 2018-04-03T11:38:32.823

The approach i like the most is to:

Call the map function on each key of the object.
Create a new object with the property "name" set to the key and the value to the corresponding value

Please note that the key has to be unique in this approach (which it should be anyways):

var categories = {
  "Asset Type": ["appliances", "electronics"],
  "Asset Availability": ["in stock"]
 };

var res = Object.keys(categories).map(key => ({
      name: key,
      values: categories[key]
    });
);

console.log(res);

score 0 · Answer 4 · answered Apr 03 '18 at 11:12

Try like this ==>

var obj = {
    "categories":
         {
          "Asset Type": ["appliances", "electronics"],
          "Asset Availability": ["in stock"]
         },
};


var categories = [];
for(let p in obj.categories) {

    categories.push({
        name: p,
        values : obj.categories[p]
    });
}

console.log(categories);

score 0 · Answer 5 · answered Apr 03 '18 at 11:19

you can try something like this or use map function there is a lot of ways

let obj = {
    "categories":
        {
            "Asset Type": ["appliances", "electronics"],
            "Asset Availability": ["in stock"]
        }

}
let categories=[];
Object.keys(obj.categories).forEach(key=>{
    categories.push({"name":key,"value":obj.categories[key]});
});
console.log(categories);

How to convert an object to array of objects

5 Answers5

Linked

Related