JSON.parse() and JSON.stringify()
JSON.stringify() and JSON.parse() are two useful tools for handling JSON-formatted content in JavaScript
JSON.stringify()
//SYNTAX JSON.stringify(value[, replacer[, space]])
TheĀ JSON.stringify()Ā method converts a JavaScript object or value to a JSON string, optionally replacing values if a replacer function is specified or optionally including only the specified properties if a replacer array is specified.
console.log(JSON.stringify({ age: 25, height: 166, weight:65 }));
// expected output: "{"age":25,"height":166,"weight":65}"
const employee = {
id: 117,
name: "Anand",
email: "me@anand.com"
};
function replacer(key, value) {
if (typeof value === "number") {
return value * 2;
}
if (key === "email") {
return "Emails are masked.";
}
return value;
}
console.log(JSON.stringify(employee));
// result: {"id":117,"name":"Anand","email":"me@anand.com"}
console.log(JSON.stringify(employee, replacer));
// {"name":"Anand","email":"Emails are masked."}
console.log(JSON.stringify(employee, null, "^_^ "));
// result: {
// ^_^ "id": 117,
// ^_^ "name": "Anand",
// ^_^ "email": "me@anand.com"
// }
console.log(JSON.parse(JSON.stringify(employee)));
// result: Object {id: 117, name: "Anand", email: "me@anand.com"}
JSON.parse()
//SYNTAX JSON.parse(text[, reviver])
TheĀ JSON.parse()Ā method parses a JSON string, constructing the JavaScript value or object described by the string.
An optionalĀ reviverĀ function can be provided to perform a transformation on the resulting object before it is returned.
var json = '{"name":"Anand", "id":117}';
obj = JSON.parse(json);
console.log(obj.name);
// expected output: Anand
console.log(obj.id);
// expected output: 117
If theĀ reviverparameterĀ is specified, the parsed value isĀ transformedĀ before being returned. If theĀ reviverĀ only transforms some values and not others, you should make sure you return all untransformed values as-is, otherwise they will be deleted from the resulting object.
JSON.parse('{"Age": 15}', (key, value) => {
console.log(key); // log the current property name".
return value * 3; // return value * 3
});
// Age
// { Age: 45 }
