DEV Community

Peter Mekhaeil
Peter Mekhaeil

Posted on • Originally published at petermekhaeil.com on

How to keep undefined values in JSON.stringify

The JSON spec does not allow undefined values, so when you try to stringify an object that contains an undefined value, the key will get removed:

const person = { name: 'Peter', age: undefined };

JSON.stringify(person);
// '{"name":"Peter"}'
Enter fullscreen mode Exit fullscreen mode

There are workarounds to keep undefined in the return value, but because it is not part of spec, you will not be able to parse the string back to a JSON. Instead, we can replace it with null which is valid.

JSON.stringify has an optional second parameter replacer that can recursively transform properties during the stringify process.

Using the replacer parameter of JSON.stringify, we can replace undefined values with a value that is accepted - such as null:

const person = { name: 'Peter', age: undefined };

function replacer(key, value) {
  return value === undefined ? null : value;
}

JSON.stringify(person, replacer);
// '{"name":"Peter","age":null}'
Enter fullscreen mode Exit fullscreen mode

An example use case where this can come useful is network request payloads in the case we need to let the server know which values are not defined. POST requests have a string body, if we need to send over an object, we require to JSON.stringify the request. The above approach will help us send over values that are not defined (provided that the server understands null as an acceptable value).

Top comments (2)

Collapse
 
rihdusr profile image
Sudhir

learnt something new. thanks!

Collapse
 
ruchernchong profile image
Ru Chern Chong

Interesting stuff! Thansk