Skip to content

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 }

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.