javascript - How to remove empty object in array?

Question

I am trying to remove the empty object {} from the below structure.

data =  [{
            "total" : "value",
            "status" : "statusVal",
            "recs" : [{
                    "total" : "value",
                    "region" : "name",
                    "recs" : [{},{
                            "recs" : [{
                                    "recs" : [{
                                            "value" : "a",
                                            "label" : "fn"
                                        }]
                                }]
                        }]
                }]
        }]

This is my JavaScript code where I process the data and trying to remove the empty object from the result.

var result = json.parse(data);
for(var i=0;i<result.length;i++){
   if(result[i].hasOwnProperty("recs")){
      var fset = result[i].recs;
      for(var j=0;j<fset.length;j++){
         if(fset[j].recs === undefined || fset[j].recs === null){
            delete fset[j].recs;
         }
         if(fset[j].hasOwnProperty("recs")){
           var sset = fset[i].recs;
             for(var k=0;k<sset.length;k++){
                var tset = sset[i].recs;
                if(sset[k].hasOwnProperty("recs")){
                   for(var z=0;z<tset.length;z++){
                      if(tset[z].hasOwnProperty("recs")){
                         //  logic to push 
                      }
                   }
                }
             }
         }
      }
   }
}

I tried checking null and undefined and also with property check bool as false. Since the empty {} is always returning length as 1, that is also ruled out. I am stuck here on processing the removal of empty object.

Above code is removing the entire recs node. Can you help me find what I am missing?

question from:https://stackoverflow.com/questions/66063872/how-to-remove-empty-object-in-array

Answer 1

Check the length of the Object.keys() to see if object is empty or not.

Object.keys(fset[j].recs).length === 0 

You can't iterate all the dynamic levels of array manually, so better to write the function which has recursive function call.

var data = [{
  "total": "value",
  "status": "statusVal",
  "recs": [{
    "total": "value",
    "region": "name",
    "recs": [{}, {
      "recs": [{
        "recs": [{
          "value": "a",
          "label": "fn"
        }]
      }]
    }]
  }]
}]

function removeEmpty(ary) {
  ary.forEach((item, index) => {
    if (Object.keys(item).length === 0) { ary.splice(index, 1); }
    else if (item.recs && item.recs.length > 0)
      removeEmpty(item.recs)
  });
}

removeEmpty(data)
console.log(data)