Change JSON object format in Javascript

Question

i have the following JSON object, which comes from DB in the following format:

{
    "total_count": 4,
    "items": [
        {
            "id": "906a1409-b66a-4f8f-b76b-36898828faf2",
            "en": "Grade 1B",
            "de": "xyz"
        },
        {
            "id": "00ace4db-d29e-4cf4-b25c-f85369db345e",
            "en": "Grade 1A",
            "de": "xyz"
        },
        {
            "id": "6b4a5578-4f27-4370-9320-a7f57a6c0f54",
            "en": "Grade 2A",
            "de": "xyz"
        },
        {
            "id": "53b52ee8-dc2e-4c6b-8017-c913d334d5af",
            "en": "Grade 2B",
            "de": "xyz
        }
    ]
}

but i need it in the following format for the usage of my UI:

{
    "total_count": 4,
    "items": [
        {
            "id": "906a1409-b66a-4f8f-b76b-36898828faf2",
            "lang": {
                 "en": "Grade 1B",
                 "de": "xyz"
            }
        },
        {
            "id": "00ace4db-d29e-4cf4-b25c-f85369db345e",
            "lang": {
                "en": "Grade 1A",
                "de": "xyz"
             }
        },
        {
            "id": "6b4a5578-4f27-4370-9320-a7f57a6c0f54",
            "lang": {
                "en": "Grade 2A",
                "de": "xyz"
            }
        },
        {
            "id": "53b52ee8-dc2e-4c6b-8017-c913d334d5af",
            "lang": {
                 "en": "Grade 2B"
                 "de": "xyz"
        }
    ]
}

is there an easy javascript way to perform this transformation? maybe map method?

i am trying something like this:

var rows_Original; // this comes from DB
var rows_Result= {}; // new json

rows_Result["total_count"] = rows_Original.length;
rows_Result['items']  = rows_Original;
rows_Result['items'].lang={};
for (var item in rows_Result['items']) {
      item[i].lang.en  = item.en;
      item[i].lang.de = 'item.de;
}

but i am keeping getting that the elements like de, en (Cannot set property 'en' of undefined)

thanks and regards

adiga · Accepted Answer · 2019-11-06 08:35:25Z

3

You could destructure the id and get the rest of properties to a lang variable. Then use Shorthand property names to create a new object with a nested lang property

const input = {total_count:4,items:[{id:"906a1409-b66a-4f8f-b76b-36898828faf2",en:"Grade 1B",de:"xyz"},{id:"00ace4db-d29e-4cf4-b25c-f85369db345e",en:"Grade 1A",de:"xyz"},{id:"6b4a5578-4f27-4370-9320-a7f57a6c0f54",en:"Grade 2A",de:"xyz"},{id:"53b52ee8-dc2e-4c6b-8017-c913d334d5af",en:"Grade 2B",de:"xyz"}]};

const { total_count, items } = input;

const newItems = items.map(({ id, ...lang }) => ({ id, lang }) ),
      output = { total_count, items: newItems };

console.log(output)

If destructuring and rest syntax is not supported, you could loop through the keys of each item like this:

var input = {total_count:4,items:[{id:"906a1409-b66a-4f8f-b76b-36898828faf2",en:"Grade 1B",de:"xyz"},{id:"00ace4db-d29e-4cf4-b25c-f85369db345e",en:"Grade 1A",de:"xyz"},{id:"6b4a5578-4f27-4370-9320-a7f57a6c0f54",en:"Grade 2A",de:"xyz"},{id:"53b52ee8-dc2e-4c6b-8017-c913d334d5af",en:"Grade 2B",de:"xyz"}]};

var output = {
  total_count: input.total_count,
  items: []
};

for (var item of input.items) {
  var newItem = {};

  for (var key in item) {
    if (key === 'id')
      newItem[key] = item[key]
    else {
      newItem.lang = newItem.lang || {};
      newItem.lang[key] = item[key]
    }
  }
  
  output.items.push(newItem)
}

console.log(output)

edited Nov 6, 2019 at 8:35

answered Nov 6, 2019 at 7:12

adiga

35.4k9 gold badges65 silver badges88 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Augustus Over a year ago

thanks, may i know what it the purpose of the second line? const { total_count, items } = input;

adiga Over a year ago

@Augustus that's also object destructuring. It is basically equivalent to const total_count = input.total_count; const items = input.items

Augustus Over a year ago

i get : Unexpected token ... on ...lang i noticed one thing that the object in input you wrote does not have "" around the keys, is this normal?

adiga Over a year ago

@Augustus Rest syntax is not supported in your environment. Added a solution with ES5 syntax

Augustus Over a year ago

Thanks, actually i am on nodejs

Sachintha Nayanajith · Accepted Answer · 2019-11-06 10:10:29Z

var input = {"total_count": 4,"items": [{"id": "906a1409-b66a-4f8f-b76b-36898828faf2","en": "Grade 1B","de": "xyz"},{"id": "00ace4db-d29e-4cf4-b25c-f85369db345e","en": "Grade 1A","de": "xyz"},{"id": "6b4a5578-4f27-4370-9320-a7f57a6c0f54","en": "Grade 2A","de": "xyz"},{"id": "53b52ee8-dc2e-4c6b-8017-c913d334d5af","en": "Grade 2B","de": "xyz"}]}

function output(inp){
   
    var output = {"total_count" : "","items" : []}
    output.total_count = inp.total_count;

    var items = inp.items;
 
    items.forEach(item => {
        var obj = {"id" : "","lang" : {"en":"","de":""}};
        obj.id = item.id;
        obj.lang.en = item.en; 
        obj.lang.de = item.de;
        output.items.push(JSON.stringify(obj));
    });
    return output; 
}

console.log(output(input));

Collectives™ on Stack Overflow

Change JSON object format in Javascript

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related