Javascript: removing elements from Json by value

Question

I need to remove elements from a json string returned by an AJAX call.

I'm not sure how to loop through the string and remove all elements where the value i NULL.

My json looks like this.

[
 {"ID":"27","Agility":"15","Balance":null,"Strength":"37","Physiology":"32"},
 {"ID":"30","Agility":"27","Balance":null,"Strength":null,"Physiology":null},
 {"ID":"34","Agility":null,"Balance":null,"Strength":null,"Physiology":null},
 {"ID":"36","Agility":null,"Balance":null,"Strength":null,"Physiology":null},
 {"ID":"40","Agility":null,"Balance":"20","Strength":null,"Physiology":"34"},
 {"ID":"42","Agility":null,"Balance":"16","Strength":null,"Physiology":null},
 {"ID":"51","Agility":null,"Balance":null,"Strength":"39","Physiology":null}
]

I thought I might do something like this for every key but i would prefer a generic function:

if(json[index].Strength == null){
    json.splice(index,1);
}

So you want to remove the object if any of its keys is `null` ? — cyr_x, Feb 24 '18 at 10:58
try this, https://stackoverflow.com/questions/23774231/how-do-i-remove-all-null-and-empty-string-values-from-a-json-object — Farrokh, Feb 24 '18 at 10:58
That was the idea. if it was not possible I would go with a line for every key. — Flemming Lemche, Feb 24 '18 at 11:03

score 2 · Accepted Answer · answered Feb 24 '18 at 11:02

You can parse json with JSON.parse method and then use filter() method on that array.

const json = '[{"ID":"27","Agility":"15","Balance":null,"Strength":"37","Physiology":"32"},{"ID":"30","Agility":"27","Balance":null,"Strength":null,"Physiology":null},{"ID":"34","Agility":null,"Balance":null,"Strength":null,"Physiology":null},{"ID":"36","Agility":null,"Balance":null,"Strength":null,"Physiology":null},{"ID":"40","Agility":null,"Balance":"20","Strength":null,"Physiology":"34"},{"ID":"42","Agility":null,"Balance":"16","Strength":null,"Physiology":null},{"ID":"51","Agility":null,"Balance":null,"Strength":"39","Physiology":null}]'

const data = JSON.parse(json).filter(o => o.Strength != null)
console.log(data)

If you want to remove elements where some property has value of null you can use some method inside filter.

const json = '[{"ID":"27","Agility":"15","Balance":null,"Strength":"37","Physiology":"32"},{"ID":"30","Agility":"27","Balance":null,"Strength":null,"Physiology":null},{"ID":"34","Agility":null,"Balance":null,"Strength":null,"Physiology":null},{"ID":"36","Agility":null,"Balance":null,"Strength":null,"Physiology":null},{"ID":"40","Agility":null,"Balance":"20","Strength":null,"Physiology":"34"},{"ID":"42","Agility":null,"Balance":"16","Strength":null,"Physiology":null},{"ID":"51","Agility":null,"Balance":null,"Strength":"39","Physiology":null}]'

const data = JSON.parse(json).filter(o => {
  return !Object.keys(o).some(k => o[k] == null)
})
console.log(data)

Hi Nenad. Thank you for your suggestions. They works fine but I think that I did not explain myself enough. :( I wanted to remove all entries with the value of null but keep the rest of the entries. So: {"ID":"30","Agility":"27","Balance":null,"Strength":null,"Physiology":null} Would be reduced to: {"ID":"30","Agility":"27"} My apologies for the unclear explanation. — Flemming Lemche, Feb 26 '18 at 18:59

score 1 · Answer 2 · answered Feb 24 '18 at 11:01

1

Use filter:

const newJson = json.filter(item => item.Strength !== null)

answered Feb 24 '18 at 11:01

Jaye Renzo Montejo

1,812
2
12
25

score 1 · Answer 3 · edited Jun 20 '20 at 09:12

If you prefer a generic function, Lodash is the best option.

PickBy picks up properties from an object, based on a Predicate.
Here predicate is Identity, which means, pickup non null properties from the object.

var jsonResponse = '[{"ID":"27","Agility":"15","Balance":null,"Strength":"37","Physiology":"32"},{"ID":"30","Agility":"27","Balance":null,"Strength":null,"Physiology":null},{"ID":"34","Agility":null,"Balance":null,"Strength":null,"Physiology":null},{"ID":"36","Agility":null,"Balance":null,"Strength":null,"Physiology":null},{"ID":"40","Agility":null,"Balance":"20","Strength":null,"Physiology":"34"},{"ID":"42","Agility":null,"Balance":"16","Strength":null,"Physiology":null},{"ID":"51","Agility":null,"Balance":null,"Strength":"39","Physiology":null}]';

var responseArr = JSON.parse(jsonResponse);

// Only lines that matter
responseArr = _.map(responseArr, function(obj) {
  return _.pickBy(obj, _.identity);
});

console.log("Array of Objects: ", responseArr);
console.log("JSON: ", JSON.stringify(responseArr));

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.5/lodash.min.js"></script>

Put the above mentioned script tag just before closing tag of your html page.

So just loop through the whole array response using map, and apply PickBy on each object of the array, and you have yourself an array of sparse objects.

It seem what I'm looking for based on the code snippet but I get an error when using your code. Uncaught ReferenceError: _ is not defined — Flemming Lemche, Feb 25 '18 at 18:36
Oh, you have to use lodash for this to work **Dependencies are mentioned just above the Run code snippet button** — Abhijit Kar ツ, Feb 26 '18 at 05:08

score 0 · Answer 4 · answered Feb 26 '18 at 07:19

0

Try Array filter() method with ES6 Arrow function.

Demo

var jsonObj = [
 {"ID":"27","Agility":"15","Balance":null,"Strength":"37","Physiology":"32"},
 {"ID":"30","Agility":"27","Balance":null,"Strength":null,"Physiology":null},
 {"ID":"34","Agility":null,"Balance":null,"Strength":null,"Physiology":null},
 {"ID":"36","Agility":null,"Balance":null,"Strength":null,"Physiology":null},
 {"ID":"40","Agility":null,"Balance":"20","Strength":null,"Physiology":"34"},
 {"ID":"42","Agility":null,"Balance":"16","Strength":null,"Physiology":null},
 {"ID":"51","Agility":null,"Balance":null,"Strength":"39","Physiology":null}
];

var res = jsonObj.filter(elem => elem.Strength !== null);

console.log(res);

answered Feb 26 '18 at 07:19

Debug Diva

26,058
13
70
123

I get an error when using your code: Uncaught TypeError: response.filter is not a function. I can also see that PHPStorm gives an error in the code on the "=>". It says "Expression Expected" what am I missing ?? – Flemming Lemche Feb 26 '18 at 09:50
@FlemmingLemche I did not use any `response.filter` in my code then how it is possible to get error on that ? You can run the `code snippet` in my answer it is working fine . – Debug Diva Feb 26 '18 at 12:34
I forgot to use .parseJSON before running your code. – Flemming Lemche Feb 26 '18 at 17:24

Javascript: removing elements from Json by value

4 Answers4