How to stringify JSON text for APIs and JavaScript projects

Most bugs in API requests don’t come from logic, they come from sending the wrong data format. You might have a clean JavaScript object, but the moment you send it to an API or store it, it needs to be a string. That’s where JSON.stringify() steps in.

This method converts JavaScript data into a JSON string that servers, browsers, and storage systems can understand. Without it, your requests can fail, data can break, or values may go missing without warning.

If you’ve ever seen empty request bodies, strange errors, or lost data in localStorage, this is often the missing piece.

In this guide, you’ll learn how JSON.stringify() works, how to use it in real API calls, and what happens to tricky values like undefined, functions, and dates, so your data stays clean and reliable.

What is JSON.stringify() in JavaScript?

JSON.stringify() is a built-in JavaScript method that converts data like objects and arrays into a JSON string. This string format is required when sending data to APIs or saving it in storage.

In JavaScript, data is stored as objects:

const user = {
 name: "Rahul",
 age: 25
};

But APIs and browsers don’t read this format directly. They expect data as a string. When you use JSON.stringify(), it turns that object into a readable JSON string:

const jsonData = JSON.stringify(user);

Now the result looks like this:

{“name”:”Rahul”,”age”:25}

This is the format used in API requests, responses, and storage systems.

In simple terms, JSON.stringify() acts as a bridge between JavaScript data and systems that require JSON format.

How to Use JSON.stringify() in API Requests

When sending data to an API, you can’t pass a JavaScript object directly. Most APIs expect data in JSON string format. That’s why JSON.stringify() is used in almost every POST or PUT request.

Sending Data with fetch()

const data = {
 name: "Amit",
 age: 25
};

fetch("https://api.example.com/users", {
 method: "POST",
 headers: {
   "Content-Type": "application/json"
 },
 body: JSON.stringify(data)
});

Why APIs Require JSON Strings

• Servers read data as text, not JavaScript objects
• JSON is a standard format used across systems
• It keeps data structured and easy to process

Common API Mistakes

• Sending raw objects instead of using JSON.stringify()
• Missing Content-Type: application/json header
• Forgetting to parse the response later

Using JSON.stringify() correctly ensures your request data is accepted and processed without errors.

How to Pretty Print JSON (for Debugging)

Sometimes, JSON data is hard to read because everything appears on one line. This can make debugging difficult. With JSON.stringify(), you can format the output to make it easier to understand.

Using the space Parameter

const user = {
 name: "Amit",
 age: 25,
 city: "Delhi"
};

console.log(JSON.stringify(user, null, 2));
Output:
{
 "name": "Amit",
 "age": 25,
 "city": "Delhi"
}

When to Use Pretty JSON

• while debugging in the console
• checking API responses
• logging structured data

The third parameter in JSON.stringify() adds spacing, which helps you read data clearly during development.

How to Filter or Modify Data with replacer

Sometimes you don’t want to send all data in your object. With JSON.stringify(), the replacer parameter lets you control what gets included in the final JSON string.

Remove Sensitive Fields

You can hide values like passwords before sending data to an API.

const user = {
 name: "Amit",
 password: "123456"
};

JSON.stringify(user, (key, value) => {
 if (key === "password") return undefined;
 return value;
});

Select Only Specific Keys

You can include only certain fields using an array.

JSON.stringify(user, [“name”]);

Modify Values Before Conversion

You can also change values during conversion.

JSON.stringify(user, (key, value) => {
 if (key === "name") return value.toUpperCase();
 return value;
});

Using the replacer with JSON.stringify() helps you clean, filter, or adjust data before sending it or storing it.

What Happens to Special Values?

Not all data behaves the same when using JSON.stringify(). Some values are changed, removed, or ignored during conversion. This can lead to missing data if you’re not aware of it.

Functions

Functions are not included in the final JSON string.

const data = {
 name: "Amit",
 greet: function () {
   return "Hello";
 }
};
JSON.stringify(data);

undefined

• Removed from objects
• Converted to null in arrays

JSON.stringify({ age: undefined }); // {}

JSON.stringify([undefined]);       // [null]

Date Objects

Dates are converted into strings.

JSON.stringify({ date: new Date() });

Output:

{“date”:”2026-03-24T00:00:00.000Z”}

Symbols

Symbols are ignored completely.

Understanding how JSON.stringify() handles these values helps prevent data loss and unexpected results in your applications.

Why JSON.stringify() Fails with Circular References

One common error with JSON.stringify() happens when your object contains a circular reference. This means an object refers back to itself, directly or indirectly.

What is a Circular Reference?

const user = {};
user.self = user;

Here, user points to itself. When JSON.stringify() tries to convert this, it gets stuck in a loop.

Error Example

JSON.stringify(user);

This will throw an error:

TypeError: Converting circular structure to JSON

How to Fix It

• Remove or avoid circular references
• Create a clean copy of the object
• Use a custom replacer function to skip problematic fields

Circular references are easy to miss in large objects. Knowing this behavior of JSON.stringify() helps you avoid crashes and debugging issues.

JSON.stringify() vs JSON.parse()

These two methods are often used together, but they do opposite things.

• JSON.stringify() converts JavaScript data into a JSON string
• JSON.parse() converts a JSON string back into a JavaScript object

Simple Example

const user = {
 name: "Amit",
 age: 25
};

// Convert object to string
const jsonData = JSON.stringify(user);

// Convert string back to object
const parsedData = JSON.parse(jsonData);

When to Use Each

• Use JSON.stringify() when sending data to APIs or storing it
• Use JSON.parse() when reading data from APIs or storage

Key Difference

• stringify → for output (sending or saving data)
• parse → for input (reading and using data)

Real Use Cases in JavaScript Projects

Understanding JSON.stringify() becomes easier when you see how it’s used in real situations. These are common tasks where it plays an important role.

Store Data in localStorage

Browsers store data as strings, so you need JSON.stringify() before saving.

const user = { name: "Amit", age: 25 };

localStorage.setItem("user", JSON.stringify(user));

Send Form Data to APIs

When submitting forms, data must be converted before sending.

const formData = {
 email: "[email protected]",
 password: "123456"
};

fetch("/login", {
 method: "POST",
 headers: {
   "Content-Type": "application/json"
 },
 body: JSON.stringify(formData)
});

Save App State

You can store app settings or user preferences and load them later.

Debug Objects in Console

Convert complex objects into readable strings for logging.

console.log(JSON.stringify(data, null, 2));

These use cases show how JSON.stringify() fits into everyday JavaScript development.

Common Mistakes to Avoid

Even though JSON.stringify() is simple to use, small mistakes can lead to bugs or missing data.

Forgetting to Parse Data Back

After storing or receiving JSON, you must convert it back.

const data = JSON.parse(localStorage.getItem(“user”));

Expecting Functions to Be Included

Functions are removed during conversion, so they won’t appear in the final output.

Losing undefined Values

Keys with undefined values are skipped in objects, which can cause missing data issues.

Using It for Deep Cloning

Some developers use JSON.stringify() to copy objects, but this can break data like dates or nested structures.

Ignoring Circular Reference Errors

If your object references itself, JSON.stringify() will throw an error and stop execution.

Being aware of these mistakes helps you use JSON.stringify() more reliably in real projects.

FAQs