Convert object to a new format while keeping all data

April 26, 2024

I need to filter an object for pertinent data for a report. It looks like this:

let oldJSON = [
    {
    "id": "c3c6f410f58e5836431b473ebcf134756232d04f2bf35edff8",
    "component": "checkbox",
    "customFields": [

    ],
    "index": 0,
    "label": "Sector2",
    "options": {
      "62f92fab79ac81d933765bd0bbc4a1f5ea26cb3a088bcb4e6e": {
        "index": 0,
        "value": "Bob",
        "label": "Bob",
        "count": 1
      },
      "2fe91aa3567c0d04c521dcd2fc7e40d7622bb8c3f594d503da": {
        "index": 1,
        "value": "Student",
        "label": "Student",
        "count": 1
      },
      "c59ea1159f33b91a7f6edc6925be5e373fc543e4": {
        "index": 2,
        "value": "BBB",
        "label": "BBB",
        "count": 1
      },
      "c59ea1159f33b91a7f6edc6925be5e373fc54AAA": {
        "index": 3,
        "value": "Orange Duck",
        "label": "Orange Duck",
        "count": 1
      }
    },
    "required": false,
    "validation": "/.*/",
    "imported": false
  },
  {
    "id": "f794c6a52e793ee6f5c42cd5df6b4435236e3495e951709485",
    "component": "textInput",
    "customFields": [

    ],
    "index": 1,
    "label": "Brown Cow",
    "options": {
    },
    "required": false,
    "validation": "/.*/",
    "imported": false
  },
  {
    "id": "f794c6a52e793ee6f5c42cd5df6b4435236e3495e95170ZZZ",
    "component": "textInput",
    "customFields": [

    ],
    "index": 1,
    "label": "Red Fish",
    "options": {
    },
    "required": false,
    "validation": "/.*/",
    "imported": false
  },
 ];

If I filter the file with this:

oldJSON = oldJSON.filter(item => item.id && item.label && item.options)
            .map(({ id, label, options }) => ({ id, label, options}));

I get

[ { id: 'c3c6f410f58e5836431b473ebcf134756232d04f2bf35edff8',
    label: 'Sector2',
    options: 
     { '62f92fab79ac81d933765bd0bbc4a1f5ea26cb3a088bcb4e6e': [Object],
       '2fe91aa3567c0d04c521dcd2fc7e40d7622bb8c3f594d503da': [Object],
       c59ea1159f33b91a7f6edc6925be5e373fc543e4: [Object],
       c59ea1159f33b91a7f6edc6925be5e373fc54AAA: [Object] } },
  { id: 'f794c6a52e793ee6f5c42cd5df6b4435236e3495e951709485',
    label: 'Brown Cow',
    options: {} },
  { id: 'f794c6a52e793ee6f5c42cd5df6b4435236e3495e95170ZZZ',
    label: 'Red Fish',
    options: {} } ]

The options sub-array has lost its values; they are now [object]

If I stringify oldJSON=JSON.stringify(oldJSON); I get this, which gives me all the data of the sub-array:

[{"id":"c3c6f410f58e5836431b473ebcf134756232d04f2bf35edff8","label":"Sector2","options":{"62f92fab79ac81d933765bd0bbc4a1f5ea26cb3a088bcb4e6e":{"index":0,"value":"Bob","label":"Bob","count":1},"2fe91aa3567c0d04c521dcd2fc7e40d7622bb8c3f594d503da":{"index":1,"value":"Student","label":"Student","count":1},"c59ea1159f33b91a7f6edc6925be5e373fc543e4":{"index":2,"value":"BBB","label":"BBB","count":1},"c59ea1159f33b91a7f6edc6925be5e373fc54AAA":{"index":3,"value":"Orange Duck","label":"Orange Duck","count":1}}},{"id":"f794c6a52e793ee6f5c42cd5df6b4435236e3495e951709485","label":"Brown Cow","options":{}},{"id":"f794c6a52e793ee6f5c42cd5df6b4435236e3495e95170ZZZ","label":"Red Fish","options":{}}]

Now I have a string, and I need an object. If I parse oldJSON=JSON.parse(oldJSON), I get an object, but I now have [Object] again in the sub-array.

How do you get oldJSON to be an object after filtering it and keeping all its data?

Thanks

>Solution :

The issue youre facing is not due to the filter operation, but rather how JS console.log() method displays nested objects. When you see [Object], it means that the value at that position is an object.

To view the nested objects in the console, you can use console.log(JSON.stringify(oldJSON, null, 2)) to pretty-print the JSON string.

This will print the entire object, including nested objects, to the console. The null and 2 arguments to JSON.stringify mean that all properties should be included in the JSON string and they should be pretty-printed with an indentation of 2 spaces