Nested array within nested object

Question

I had an object whose structure is

const data = {
    "message": "fetch responces successfully",
    "responce": [
        {
            "created_AT": "Mon, 03 Jan 2022 17:39:24 GMT",
            "created_BY": "avinash",
            "dateTime": "Mon, 03 Jan 2022 17:39:24 GMT",
            "deleted_BY": "",
            "flag": 0,
            "project_ID": "infobot1234",
            "responce": {
                "uttence_test_heading": [
                    {
                        "buttons": [
                            {
                                "payload": "/my_localities",
                                "title": "savings"
                            },
                            {
                                "payload": "/my_localities12333qqqwq",
                                "title": "current"
                            },
                            {
                                "payload": "/fruits",
                                "title": "platinum"
                            }
                        ]
                    },
                    {
                        "title": "Test Heading"
                    }
                ]
            },
            "responce_ID": "6bbb20d6-7f71-408a-a78a-bab39a30016f",
            "responce_name": "uttence_test_heading",
            "updated_BY": "",
            "user_ID": "av1234"
        },
        {
            "created_AT": "Tue, 04 Jan 2022 17:49:36 GMT",
            "created_BY": "avinash",
            "dateTime": "Tue, 04 Jan 2022 17:49:36 GMT",
            "deleted_BY": "",
            "flag": 0,
            "project_ID": "infobot1234",
            "responce": {
                "utter_content": [
                    {
                        "text": "text_title for buttonqwqwq"
                    }
                ]
            },
            "responce_ID": "81d699ee-3e78-4356-b703-af095d91e36b",
            "responce_name": "utter_txt1234",
            "updated_BY": "",
            "user_ID": "av1234"
        },
        {
            "created_AT": "Thu, 13 Jan 2022 18:06:39 GMT",
            "created_BY": "avinash",
            "dateTime": "Thu, 13 Jan 2022 18:06:39 GMT",
            "deleted_BY": "",
            "flag": 0,
            "project_ID": "infobot1234",
            "responce": {
                "uttence_text_heading": [
                    {
                        "buttons": [
                            {
                                "payload": "/my_localities",
                                "title": "savings"
                            },
                            {
                                "payload": "/my_localities12333qqqwq",
                                "title": "current"
                            },
                            {
                                "payload": "/test",
                                "title": "premium"
                            }
                        ]
                    },
                    {
                        "title": "Text Heading"
                    }
                ]
            },
            "responce_ID": "bb6b0005-bbd4-49a1-8b25-58e0768800a1",
            "responce_name": "uttence_text_heading",
            "updated_BY": "",
            "user_ID": "av1234"
        },
        {
            "created_AT": "Thu, 13 Jan 2022 20:13:54 GMT",
            "created_BY": "avinash",
            "dateTime": "Thu, 13 Jan 2022 20:13:54 GMT",
            "deleted_BY": "",
            "flag": 0,
            "project_ID": "infobot1234",
            "responce": {
                "uttence_heading_test": [
                    {
                        "buttons": [
                            {
                                "payload": "/my_localities",
                                "title": "savings"
                            },
                            {
                                "payload": "/fruits",
                                "title": "current"
                            },
                            {
                                "payload": "/undefined",
                                "title": "premium"
                            }
                        ]
                    },
                    {
                        "title": "heading test"
                    }
                ]
            },
            "responce_ID": "7aeb2a42-a5f8-464d-832d-47cee4cfdb38",
            "responce_name": "uttence_heading_test",
            "updated_BY": "",
            "user_ID": "av1234"
        }
    ],
    "status_code": 0
}

I was able to extract below array of objects by using data.responce.map(responce => responce.responce)

[{
  uttence_test_heading: [{
  buttons: [{
  payload: "/my_localities",
  title: "savings"
}, {
  payload: "/my_localities12333qqqwq",
  title: "current"
}, {
  payload: "/fruits",
  title: "platinum"
}]
}, {
  title: "Test Heading"
}]
}, {
  utter_content: [{
  text: "text_title for buttonqwqwq"
}]
}, {
  uttence_text_heading: [{
  buttons: [{
  payload: "/my_localities",
  title: "savings"
}, {
  payload: "/my_localities12333qqqwq",
  title: "current"
}, {
  payload: "/test",
  title: "premium"
}]
}, {
  title: "Text Heading"
}]
}, {
  uttence_heading_test: [{
  buttons: [{
  payload: "/my_localities",
  title: "savings"
}, {
  payload: "/fruits",
  title: "current"
}, {
  payload: "/undefined",
  title: "premium"
}]
}, {
  title: "heading test"
}]
}]

Now I want to construct an array of objects whose structure is something like below

This is my expected result, but I am stuck since the uttence_name is a key and it is different for each object so could someone please guide me through how can I acheive my expected result. Please Help !

[{uttence_name: ' uttence_test_heading',buttons: ['savings','current','platinum'],text: '',responce_ID:'6bbb20d6-7f71-408a-a78a-bab39a30016f'},
{uttence_name: 'utter_content',buttons: '',text: 'text_title for buttonqwqwq',responce_ID:'81d699ee-3e78-4356-b703-af095d91e36b'},
{uttence_name:'uttence_text_heading',buttons:['savings','current','premium'],text: '',responce_ID:'bb6b0005-bbd4-49a1-8b25-58e0768800a1'}]

Answer 1

You can chain a second map and obtain the desired result. But my answer assumes that the arrays only have a single item in them.

Also, I didn't quite understand what you wanted to do with the buttons so I've kept them as an array.

You can run the snippet below to see if you're getting the desired output.

 const data={message:"fetch responces successfully",responce:[{created_AT:"Mon, 03 Jan 2022 17:39:24 GMT",created_BY:"avinash",dateTime:"Mon, 03 Jan 2022 17:39:24 GMT",deleted_BY:"",flag:0,project_ID:"infobot1234",responce:{uttence_test_heading:[{buttons:[{payload:"/my_localities",title:"savings",},{payload:"/my_localities12333qqqwq",title:"current",},{payload:"/fruits",title:"platinum",},],},{title:"Test Heading",},],},responce_ID:"6bbb20d6-7f71-408a-a78a-bab39a30016f",responce_name:"uttence_test_heading",updated_BY:"",user_ID:"av1234",},{created_AT:"Tue, 04 Jan 2022 17:49:36 GMT",created_BY:"avinash",dateTime:"Tue, 04 Jan 2022 17:49:36 GMT",deleted_BY:"",flag:0,project_ID:"infobot1234",responce:{utter_content:[{text:"text_title for buttonqwqwq",},],},responce_ID:"81d699ee-3e78-4356-b703-af095d91e36b",responce_name:"utter_txt1234",updated_BY:"",user_ID:"av1234",},{created_AT:"Thu, 13 Jan 2022 18:06:39 GMT",created_BY:"avinash",dateTime:"Thu, 13 Jan 2022 18:06:39 GMT",deleted_BY:"",flag:0,project_ID:"infobot1234",responce:{uttence_text_heading:[{buttons:[{payload:"/my_localities",title:"savings",},{payload:"/my_localities12333qqqwq",title:"current",},{payload:"/test",title:"premium",},],},{title:"Text Heading",},],},responce_ID:"bb6b0005-bbd4-49a1-8b25-58e0768800a1",responce_name:"uttence_text_heading",updated_BY:"",user_ID:"av1234",},{created_AT:"Thu, 13 Jan 2022 20:13:54 GMT",created_BY:"avinash",dateTime:"Thu, 13 Jan 2022 20:13:54 GMT",deleted_BY:"",flag:0,project_ID:"infobot1234",responce:{uttence_heading_test:[{buttons:[{payload:"/my_localities",title:"savings",},{payload:"/fruits",title:"current",},{payload:"/undefined",title:"premium",},],},{title:"heading test",},],},responce_ID:"7aeb2a42-a5f8-464d-832d-47cee4cfdb38",responce_name:"uttence_heading_test",updated_BY:"",user_ID:"av1234",},],status_code:0,} const result = data.responce.map((res) => ({...res.responce, responce_ID: res.responce_ID })).map((obj) => ({ utterance_name: Object.keys(obj)[0], text: Object.values(obj)[0][0].text || "", buttons: Object.values(obj)[0][0].buttons?.map((btn) => btn.title) || "", responce_ID: obj.responce_ID })); console.log(result);

Answer 2

An example using map , find , some and?. optional chaining and?? Nullish coalescing operator

 const data = { message: "fetch responces successfully", responce: [ { created_AT: "Mon, 03 Jan 2022 17:39:24 GMT", created_BY: "avinash", dateTime: "Mon, 03 Jan 2022 17:39:24 GMT", deleted_BY: "", flag: 0, project_ID: "infobot1234", responce: { uttence_test_heading: [ { buttons: [ { payload: "/my_localities", title: "savings", }, { payload: "/my_localities12333qqqwq", title: "current", }, { payload: "/fruits", title: "platinum", }, ], }, { title: "Test Heading", }, ], }, responce_ID: "6bbb20d6-7f71-408a-a78a-bab39a30016f", responce_name: "uttence_test_heading", updated_BY: "", user_ID: "av1234", }, { created_AT: "Tue, 04 Jan 2022 17:49:36 GMT", created_BY: "avinash", dateTime: "Tue, 04 Jan 2022 17:49:36 GMT", deleted_BY: "", flag: 0, project_ID: "infobot1234", responce: { utter_content: [ { text: "text_title for buttonqwqwq", }, ], }, responce_ID: "81d699ee-3e78-4356-b703-af095d91e36b", responce_name: "utter_txt1234", updated_BY: "", user_ID: "av1234", }, { created_AT: "Thu, 13 Jan 2022 18:06:39 GMT", created_BY: "avinash", dateTime: "Thu, 13 Jan 2022 18:06:39 GMT", deleted_BY: "", flag: 0, project_ID: "infobot1234", responce: { uttence_text_heading: [ { buttons: [ { payload: "/my_localities", title: "savings", }, { payload: "/my_localities12333qqqwq", title: "current", }, { payload: "/test", title: "premium", }, ], }, { title: "Text Heading", }, ], }, responce_ID: "bb6b0005-bbd4-49a1-8b25-58e0768800a1", responce_name: "uttence_text_heading", updated_BY: "", user_ID: "av1234", }, { created_AT: "Thu, 13 Jan 2022 20:13:54 GMT", created_BY: "avinash", dateTime: "Thu, 13 Jan 2022 20:13:54 GMT", deleted_BY: "", flag: 0, project_ID: "infobot1234", responce: { uttence_heading_test: [ { buttons: [ { payload: "/my_localities", title: "savings", }, { payload: "/fruits", title: "current", }, { payload: "/undefined", title: "premium", }, ], }, { title: "heading test", }, ], }, responce_ID: "7aeb2a42-a5f8-464d-832d-47cee4cfdb38", responce_name: "uttence_heading_test", updated_BY: "", user_ID: "av1234", }, ], status_code: 0, }; const findObjectByKey = (array, key) => array.find(item => Object.keys(item).some(k => k === key))?.[key]; const output = data.responce.map(({ responce_ID, responce }) => { const uttence_name = Object.keys(responce)[0]; const arr = responce[uttence_name]; const buttons = findObjectByKey(arr, "buttons")?.map(({ title }) => title).join(" ")?? ""; const title = findObjectByKey(arr, "title")?? ""; const text = findObjectByKey(arr, "text")?? ""; return { responce_ID, uttence_name, buttons, title, text, }; }); console.log(output);

Answer 3

Here is the required result based upon the data you have given. In the code, the best case scenario is, it checks whether you have object containing text or not and then adds the data accordingly . It also has response_ID

 const data={message:"fetch responces successfully",responce:[{created_AT:"Mon, 03 Jan 2022 17:39:24 GMT",created_BY:"avinash",dateTime:"Mon, 03 Jan 2022 17:39:24 GMT",deleted_BY:"",flag:0,project_ID:"infobot1234",responce:{uttence_test_heading:[{buttons:[{payload:"/my_localities",title:"savings",},{payload:"/my_localities12333qqqwq",title:"current",},{payload:"/fruits",title:"platinum",},],},{title:"Test Heading",},],},responce_ID:"6bbb20d6-7f71-408a-a78a-bab39a30016f",responce_name:"uttence_test_heading",updated_BY:"",user_ID:"av1234",},{created_AT:"Tue, 04 Jan 2022 17:49:36 GMT",created_BY:"avinash",dateTime:"Tue, 04 Jan 2022 17:49:36 GMT",deleted_BY:"",flag:0,project_ID:"infobot1234",responce:{utter_content:[{text:"text_title for buttonqwqwq",},],},responce_ID:"81d699ee-3e78-4356-b703-af095d91e36b",responce_name:"utter_txt1234",updated_BY:"",user_ID:"av1234",},{created_AT:"Thu, 13 Jan 2022 18:06:39 GMT",created_BY:"avinash",dateTime:"Thu, 13 Jan 2022 18:06:39 GMT",deleted_BY:"",flag:0,project_ID:"infobot1234",responce:{uttence_text_heading:[{buttons:[{payload:"/my_localities",title:"savings",},{payload:"/my_localities12333qqqwq",title:"current",},{payload:"/test",title:"premium",},],},{title:"Text Heading",},],},responce_ID:"bb6b0005-bbd4-49a1-8b25-58e0768800a1",responce_name:"uttence_text_heading",updated_BY:"",user_ID:"av1234",},{created_AT:"Thu, 13 Jan 2022 20:13:54 GMT",created_BY:"avinash",dateTime:"Thu, 13 Jan 2022 20:13:54 GMT",deleted_BY:"",flag:0,project_ID:"infobot1234",responce:{uttence_heading_test:[{buttons:[{payload:"/my_localities",title:"savings",},{payload:"/fruits",title:"current",},{payload:"/undefined",title:"premium",},],},{title:"heading test",},],},responce_ID:"7aeb2a42-a5f8-464d-832d-47cee4cfdb38",responce_name:"uttence_heading_test",updated_BY:"",user_ID:"av1234",},],status_code:0,}; let newObject = []; data.responce.forEach((item) => { // We will get each item here now // Assuming object of item.responce will come always const objectName = Object.keys(item.responce)[0]; const dataToPush = { 'responce_ID': item.responce_ID, 'uttence_name': objectName, 'buttons': item.responce[objectName][0].buttons? item.responce[objectName][0].buttons.map(data => data.title): '', 'text': item.responce[objectName].find(data => data.hasOwnProperty('text'))? item.responce[objectName].map(value => value.text)[0]: '' }; // Finally adding the item to the array to give the final output newObject.push(dataToPush); }); console.log(newObject);