How to convert json array object to json array

Question

** Scenario:**

I am using lodash to remove the empty key from my JSON.

But when it removes the keys it converts my array in an object for example

{
"projection": "Miller",
"series": [
    {
        "mapPolygons": {
        "states": {
            "hover": {
                "properties": {
                    "fill": "#67b7dc"
                }
            }
        }
    },
    "heatRules": {
        "0": {
            "min": "#a82626",
            "max": "#AAAA00"              
        }
    },
    "data": {
        "0": {
            "id": "US",
            "value": 3461.37
        },
        "1": {
            "id": "DE",
            "value": 2858.09
        },
        "2": {
            "id": "NO",
            "value": 3418.87
        },
        "3": {
            "id": "ES",
            "value": 3522.46
        }
    }
}
],
 "zoomControl": {
"slider": {
    "height": 100
}
},
  "titles": {
    "0": {
    "fontSize": 20
    }
},
"homeZoomLevel": 1
}

Problem:

If you see in the above code there is heatRules property which is an array after converting it is converted into object of 0, again if you see data attribute it does same if you see titles attribute it does same over there.

i have used below link code to remove empty object and null object:

Why lodash converts my array into object?

Input Data:

    {
"projection": "Miller",
"series": [
    {
    "mapPolygons": {
    "states": {
        "hover": {
            "properties": {
                "fill": "#67b7dc",
                "size": ""
            }
        }
    }
},
"heatRules": [
     {
        "min": "#a82626",
        "max": "#AAAA00",
         "fill": null              
    }
],
"data": [
    {
        "id": "US",
        "value": 3461.37
    },
    {
        "id": "DE",
        "value": 2858.09
    },
    {
        "id": "NO",
        "value": 3418.87
    },
    {
        "id": "ES",
        "value": 3522.46
    }
]
}
],
     "zoomControl": {
"slider": {
    "height": 100
}
},
  "titles": [
   {
    "fontSize": 20,
   "fontColor": "" 
    }
],
"homeZoomLevel": 1
}

Output Data:

{
"projection": "Miller",
"series": [
    {
    "mapPolygons": {
    "states": {
        "hover": {
            "properties": {
                "fill": "#67b7dc"
            }
        }
    }
},
"heatRules": [
     {
        "min": "#a82626",
        "max": "#AAAA00"              
    }
],
"data": [
    {
        "id": "US",
        "value": 3461.37
    },
    {
        "id": "DE",
        "value": 2858.09
    },
    {
        "id": "NO",
        "value": 3418.87
    },
    {
        "id": "ES",
        "value": 3522.46
    }
]
}
],
     "zoomControl": {
"slider": {
    "height": 100
}
},
  "titles": [
   {
    "fontSize": 20 
    }
],
"homeZoomLevel": 1
}

If you see above output it removes null and blank key from properties -> size, heatRulues -> fill and from title it removes fontColor.

Please share your input sample data

Arshpreet Wadehra
– Arshpreet Wadehra

2019-01-25 05:50:58 +00:00
Commented Jan 25, 2019 at 5:50 — Arshpreet Wadehra
– Arshpreet Wadehra, Commented Jan 25, 2019 at 5:50
and also the expected output.

holydragon
– holydragon

2019-01-25 06:19:54 +00:00
Commented Jan 25, 2019 at 6:19 — holydragon
– holydragon, Commented Jan 25, 2019 at 6:19
@ArshpreetWadehra i have provided input data.

Mayur
– Mayur

2019-01-25 06:52:25 +00:00
Commented Jan 25, 2019 at 6:52 — Mayur
– Mayur, Commented Jan 25, 2019 at 6:52
@holydragon i have provided expected output too.

Mayur
– Mayur

2019-01-25 06:52:48 +00:00
Commented Jan 25, 2019 at 6:52 — Mayur
– Mayur, Commented Jan 25, 2019 at 6:52

Steven Spungin · Accepted Answer · 2019-01-25 14:14:02Z

1

If your code uses

typeof v === 'object'

it will return true for arrays.

To check for array, use

Array.isArray(t)

Treating array as object and iterating over keys will result in your issue.

Sample Function To Recurse But Not Process Arrays

function removeFalsies(obj) {
  return _.transform(obj, function(o, v, k, l) {
      if (Array.isArray(obj) {
          for (let arrItem of obj) {
            removeFalsies(arrItem);
          }
          return
        }
        // else not array...
      })
  }

edited Jan 25, 2019 at 14:14

answered Jan 25, 2019 at 6:45

Steven Spungin

29.5k7 gold badges97 silver badges85 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Mayur Over a year ago

Thanks, @steven-spungin could your please update in the function.

Steven Spungin Over a year ago

@Mayur I do no see a function in your question. Are you referring to the linked answer? If so, I added a modification that should process items in the array instead of the provided code.

holydragon · Accepted Answer · 2019-01-25 07:37:03Z

STEPS

Iterate over heatRules property (since it is array so there might be multiple objects in there)
Iterate over the properties of each object in heatRules
Delete every property that has value of null

let data = {
  "projection": "Miller",
  "series": [{
    "mapPolygons": {
      "states": {
        "hover": {
          "properties": {
            "fill": "#67b7dc",
            "size": ""
          }
        }
      }
    },
    "heatRules": [{
      "min": "#a82626",
      "max": "#AAAA00",
      "fill": null
    }],
    "data": [{
        "id": "US",
        "value": 3461.37
      },
      {
        "id": "DE",
        "value": 2858.09
      },
      {
        "id": "NO",
        "value": 3418.87
      },
      {
        "id": "ES",
        "value": 3522.46
      }
    ]
  }],
  "zoomControl": {
    "slider": {
      "height": 100
    }
  },
  "titles": [{
    "fontSize": 20,
    "fontColor": ""
  }],
  "homeZoomLevel": 1
}

data.series[0].heatRules.forEach(hr => {
  Object.keys(hr).forEach(p => {
    if (hr[p] === null) {
      delete hr[p]
    }
  })
})

console.log(data)

Arshpreet Wadehra · Accepted Answer · 2019-01-25 07:37:17Z

I tried Why lodash converts my array into object? e.g. and its working. check the code below.

let a = {
  "projection": "Miller",
  "series": [
    {
      "mapPolygons": {
        "states": {
          "hover": {
            "properties": {
              "fill": "#67b7dc",
              "size": ""
            }
          }
        }
      },
      "heatRules": [
        {
          "min": "#a82626",
          "max": "#AAAA00",
          "fill": null
        }
      ],
      "data": [
        {
          "id": "US",
          "value": 3461.37
        },
        {
          "id": "DE",
          "value": 2858.09
        },
        {
          "id": "NO",
          "value": 3418.87
        },
        {
          "id": "ES",
          "value": 3522.46
        }
      ]
    }
  ],
  "zoomControl": {
    "slider": {
      "height": 100
    }
  },
  "titles": [
    {
      "fontSize": 20,
      "fontColor": ""
    }
  ],
  "homeZoomLevel": 1
}

removeFalses = (obj)=> {
    return _.transform(obj, function (o, v, k) {

      if (v && typeof v === 'object' && !_.isArray(v)) {

        if (v !== '') {
          o[k] = removeFalses(v);
        }

      } else if(_.isArray(v)) {
  if(!o.hasOwnProperty(k)) o[k] = [];

  //And if it is array loop through it

  _.forEach(v, function(v1, k1) {
     o[k].push(removeFalses(v1));
  });

  }else if (v === false) {
        o[k] = v;
      } else if (v) {
        o[k] = v;
      }
    });
  }

console.log(removeFalses(a)) //desired output

Collectives™ on Stack Overflow

How to convert json array object to json array

3 Answers 3

Sample Function To Recurse But Not Process Arrays

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Sample Function To Recurse But Not Process Arrays

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related