how to encode/ change the format of existing json to another using angular/javascript

Question

here im having a json in below format

Present Format

 {
  "info": {
    "laptop": {
    },
    "config": {
      "properties": {
        "ram": {
        },
        "processor": {
        },
        "hdd": {

        }
      }
    },
    "link": {

    },
    "name": {

    },
    "company": {
      "properties": {
        "model": {

        },
        "maker": {
          "type": "integer"
        },
        "country": {
          "type": "text"
        },
        "enterprise": {

        }

      }
    }
  }
}

i am using some plugin like ngx-tree, primeng plugins for which data needs to be in different format like below

Required Format

  [
        {
          name: 'laptop',

        },
        {
          name: 'config',
          children: [
            { name: 'ram', children: [] },
            { name: 'processor' },
            {name:'hdd'}
          ]
        },
         {
          name: 'link',
          children: []
        },
        {
          name: 'name',
          children: []
        },

        {
          name: 'company',
          children: [
            { name: 'model' },
            { name: 'maker' },
            { name: 'country' },
            { name: 'enterprise' }

          ]
        }
      ];

now my issue is how can i change my data from the present format to required format ? is there any suggestion so that i can make that change

Answer 1

You can recursively walk over the input object to map it to the required format with something like this:

  function recursiveConvert(input) {
     let converted = []

     for(i in input){
       converted.push({
         name: i,
         children: []
       })

       if(input[i].properties) {
          converted[converted.length - 1].children.push(recursiveConvert(input[i].properties)) 
       }
     }

     return converted
  }

If you want no empty children arrays simply change it to:

function recursiveConvert(input) {
     let converted = []

     for(i in input){
       converted.push({
         name: i
       })

       if(input[i].properties) {
          let lastInsert = converted[converted.length - 1]

          lastInsert.children = [recursiveConvert(input[i].properties)]
       }
     }

     return converted
  }

be sure to call it with recursiveConvert(myInput.info) since it doesn't expect that wrapper object.

Answer 2

You can do:

 const json = {"info": {"laptop": {},"config": {"properties": {"ram": {},"processor": {},"hdd": {}}},"link": {},"name": {},"company": {"properties": {"model": {},"maker": {"type": "integer"},"country": {"type": "text"},"enterprise": {}}}}}; const result = Object.keys(json.info).map(k => ({ name: k, children: json.info[k].properties ? Object.keys(json.info[k].properties).map(kk => ({name: kk})) : [] })); console.log(result); 

 .as-console-wrapper { max-height: 100% !important; top: 0; } 

Answer 3

Here's a one line, purely functional solution:

 const input = { "info": { "laptop": { }, "config": { "properties": { "ram": { }, "processor": { }, "hdd": { } } }, "link": { }, "name": { }, "company": { "properties": { "model": { "properties": { "apple": {}, "banana": {}, "pear": {} } }, "maker": { "type": "integer" }, "country": { "type": "text" }, "enterprise": { } } } } } const convert = input => Object .entries(input) .map(([name, value]) => ({ name, children: convert(value.properties || {}) })) console.log(convert(input.info)); 

Here's an es2015 version:

function convert(input) {
  return Object.keys(input).map(function(name) {
    return {
      name: name,
      children: convert(input[name].properties || {})
    };
  });
}