Flatten deeply nested array of objects

Question

I have following array of objects

            {
                "_id": "63c6cd09c4836daca5a8ea51",
                "groupBy": "Title Metadata",
                "name": "Search Title Name",
                "tooltip": "Searches for books based on title input",
                "renderNATypes": false,
                "isFrequentlyUsed": true,
                "childFilters": [
                    {
                        "_id": "63c6cd09c4836daca5a8ea1f",
                        "controlType": {
                            "name": "inputbox"
                        },
                    },
                    {
                        "_id": "63c6cd09c42136daca5a8ea1f",
                        "controlType": {
                            "name": "dropdown"
                        },
                    }

                ]
            }
        ]

Output I am expecting is new array with number of child with child properties and also parent property

            [{
                "_id": "63c6cd09c4836daca5a8ea51",
        "child_id": "63c6cd09c4836daca5a8ea1f"
                "groupBy": "Title Metadata",
                "name": "Search Title Name",
                "tooltip": "Searches for books based on title input",
                "renderNATypes": false,
                "isFrequentlyUsed": true,
        "controlType": {"name": "inputbox"}
            },
      {
                "_id": "63c6cd09c4836daca5a8ea51",
        "child_id": "63c6cd09c42136daca5a8ea1f"
                "groupBy": "Title Metadata",
                "name": "Search Title Name",
                "tooltip": "Searches for books based on title input",
                "renderNATypes": false,
                "isFrequentlyUsed": true,
        "controlType": {"name": "dropdown"},
      }
        ]

I have tried lodash flatMap, flatMapDeep and few more vanilla javascript without any success.

Thanks in advance

Does this answer your question? [One liner to flatten nested object](https://stackoverflow.com/questions/33036487/one-liner-to-flatten-nested-object) — Alexander Lallier, Jan 18 '23 at 13:59

phuwin · Accepted Answer · 2023-01-18T14:12:41.467

You can achieve your result by using reduce like this

const flattenByChildFilters = (orig) => orig.reduce((item, cur) => {
    const {childFilters, ...base} = cur;

    const newItems = childFilters.map(({controlType}) => ({
      ...base,
      controlType,
    }));
    cur = [...item, ...newItems];
    return cur;
  }, []);


console.log(flattenByChildFilters([
  {
    _id: '63c6cd09c4836daca5a8ea51',
    groupBy: 'Title Metadata',
    name: 'Search Title Name',
    tooltip: 'Searches for books based on title input',
    renderNATypes: false,
    isFrequentlyUsed: true,
    childFilters: [
      {
        _id: '63c6cd09c4836daca5a8ea1f',
        controlType: {
          name: 'inputbox',
        },
      },
      {
        _id: '63c6cd09c42136daca5a8ea1f',
        controlType: {
          name: 'dropdown',
        },
      },
    ],
  },
]));

Flatten deeply nested array of objects

1 Answers1