How to modify Array of objects using JS?

Question

I have data that contains array objects and some objects contains arrays of objects like below:

Original :

[{
        "order": 1,
        "product": "A",
        "item": "A"
    }, {
        "order": 1,
        "product": "B",
        "item": "B"
    },

    {
        "order": 14,
        "product": "C",
        "item": "C",
        "lists": [{
            "order": 1,
            "product": "C1",
            "item": "c1"
        }, {
            "order": 1,
            "product": "c2",
            "item": "c3"
        }]
    }, {
        "order": 1,
        "product": "d",
        "item": "d"
    }, {
        "order": 72,
        "product": "e",
        "item": "e",
        "lists": [{
            "order": 2,
            "product": "e1",
            "item": "e1"
        }, {
            "order": 6,
            "product": "e2",
            "item": "e2"
        }]
    }, {
        "order": 1,
        "product": "e3",
        "item": "e3"
    }
]

I want to change the data like array of objects same as below,

Modified:

[{
    "order": 1,
    "product": "A",
    "item": "A"
}, {
    "order": 1,
    "product": "B",
    "item": "B"
}, {
    "order": 14,
    "product": "C",
    "item": "C"

}, {
    "order": 1,
    "product": "C1",
    "item": "c1"
}, {
    "order": 1,
    "product": "c2",
    "item": "c3"
}, {
    "order": 1,
    "product": "d",
    "item": "d"
}, {
    "order": 72,
    "product": "e",
    "item": "e"

}, {
    "order": 2,
    "product": "e1",
    "item": "e1"
}, {
    "order": 6,
    "product": "e2",
    "item": "e2"
}, {
    "order": 1,
    "product": "e3",
    "item": "e3"
}]

Answer 1

You could use Array#reduce and check for lists and concat a new array with the actual values and the lists items, otherwise take the actual element.

 var data = [{ order: 1, product: "A", item: "A" }, { order: 1, product: "B", item: "B" }, { order: 14, product: "C", item: "C", lists: [{ order: 1, product: "C1", item: "c1" }, { order: 1, product: "c2", item: "c3" }] }, { order: 1, product: "d", item: "d" }, { order: 72, product: "e", item: "e", lists: [{ order: 2, product: "e1", item: "e1" }, { order: 6, product: "e2", item: "e2" }] }, { order: 1, product: "e3", item: "e3" }], flat = data.reduce(function (r, a) { return r.concat(a.lists && [{ order: a.order, product: a.product, item: a.item }].concat(a.lists) || a); }, []); console.log(flat); 

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

Answer 2

Parse the array, then check if it has a list key or not, if it has then concatenate the list in the new array and delete the lists key and push the element itself otherwise just directly push the element.

var parsedData = [];
// Iterate through data array
data.forEach(function(el) {

  // If it doesnt have a list key directly push the element
  if (!el.hasOwnProperty("lists"))
    parsedData.push(el);

  // If it has a list key
  else {
    // Concat the list to the parsedData
    parsedData = parsedData.concat(el.lists);
    delete el.lists;
    // And push current item after deleting the list.
    parsedData.push(el);

  }

});

Live Code

 var data = [{ "order": 1, "product": "A", "item": "A" }, { "order": 1, "product": "B", "item": "B" }, { "order": 14, "product": "C", "item": "C", "lists": [{ "order": 1, "product": "C1", "item": "c1" }, { "order": 1, "product": "c2", "item": "c3" }] }, { "order": 1, "product": "d", "item": "d" }, { "order": 72, "product": "e", "item": "e", "lists": [{ "order": 2, "product": "e1", "item": "e1" }, { "order": 6, "product": "e2", "item": "e2" }] }, { "order": 1, "product": "e3", "item": "e3" } ]; var parsedData = []; // Iterate through data array data.forEach(function(el) { // If it doesnt have a list key directly push the element if (!el.hasOwnProperty("lists")) parsedData.push(el); // If it has a list key else { // Concat the list to the parsedData parsedData = parsedData.concat(el.lists); delete el.lists; // And push current item after deleting the list. parsedData.push(el); } }); document.write(JSON.stringify(parsedData)); 

Answer 3

This snippet might help you.

 var data = [{ "order": 1, "product": "A", "item": "A" }, { "order": 1, "product": "B", "item": "B" }, { "order": 14, "product": "C", "item": "C", "lists": [{ "order": 1, "product": "C1", "item": "c1" }, { "order": 1, "product": "c2", "item": "c3" }] }, { "order": 1, "product": "d", "item": "d" }, { "order": 72, "product": "e", "item": "e", "lists": [{ "order": 2, "product": "e1", "item": "e1" }, { "order": 6, "product": "e2", "item": "e2" }] }, { "order": 1, "product": "e3", "item": "e3" } ]; var newObj = []; data.forEach(function (val) { if(val.hasOwnProperty("lists")) { var lists = val.lists; delete val["lists"]; newObj.push(val); lists.forEach(function (valList) { newObj.push(valList); }); } else { newObj.push(val); } }); console.log(JSON.stringify(newObj));