DEV Community

Eka Prasetia
Eka Prasetia

Posted on

JSON.Stringify on second argument

#javascript

Originally written in 2020. Republished here.

In JavaScript, JSON.stringify() is a built-in method that converts a JavaScript value into a JSON string representation. JSON (JavaScript Object Notation) is a common format for exchanging data between web applications and APIs.

Here's a breakdown of JSON.stringify():

Syntax:

JSON.stringify(value, replacer, space);
Enter fullscreen mode Exit fullscreen mode
  • value: The JavaScript value to be converted (object, array, string, number, etc.).
  • replacer (optional): A function or array that transforms the value before stringification.
  • space (optional): A string (or number) used to indent the output for readability.

What it Does:

  • Converts primitive values like strings, numbers, booleans, and null directly to their JSON equivalents.
  • Converts arrays by iterating through their elements and stringifying each one.
  • Converts objects by enumerating their properties and stringifying their key-value pairs.
  • Excludes properties with undefined values or functions by default.
  • Can be customized with the replacer and space options.

Examples:

const object = { name: "Alice", age: 30 };
const jsonString = JSON.stringify(object); // '{"name":"Alice","age":30}'

const array = [1, 2, 3];
const jsonString = JSON.stringify(array); // '[1,2,3]'

const date = new Date();
const jsonString = JSON.stringify(date); // '2024-02-07T02:54:22.394Z' (not recommended)

// Customizing with replacer:
const object = { name: "Alice", age: 30, password: "secret" };
const jsonString = JSON.stringify(object, (key, value) => {
  if (key === "password") return undefined; // Exclude password
  return value;
});
Enter fullscreen mode Exit fullscreen mode

Let's take a look another example, we have an array of objects and we want to get some specified properties and their value from the objects. For example given an Objects:

const objects = [
  { name: "Eka Prasetia" },
  { city: "Jakarta" },
  { hobby: "Play codes" },
];
Enter fullscreen mode Exit fullscreen mode

Get some specified properties.

JSON.stringify(objects, ["name", "hobby"], 2);
// output "name" and "hobby" properties and their value
Enter fullscreen mode Exit fullscreen mode

Another way, we can replace property value as follow.

const result = JSON.stringify(
  objects,
  (key, value) => {
    if (key.match(/name|city/)) return "👨‍👩‍👧✌";
    return value;
  },
  2
);
// output [{ "name": "👨‍👩‍👧✌"},{"city": "👨‍👩‍👧✌"},{"hobby": "Play codes"}]
Enter fullscreen mode Exit fullscreen mode

The second argument is a replacer function, which is called for each property in the object being stringified. The replacer function can return a string or a number that will be used to replace the property's value, or undefined if the property should be removed from the stringified output.

Key Points:

  • JSON.stringify() is useful for sending data to servers or storing it in local storage.
  • It's important to be mindful of circular references or functions when stringifying objects.
  • Consider using replacer to customize the output or exclude sensitive information.
  • Be cautious when stringifying dates as JSON doesn't have a native date type.

Thank you for reading this article, I hope you find it useful. Happy coding! 🔥

Top comments (0)