JSON Stringify

JSON Stringify: JSON.stringify()

A common use of JSON is to exchange data to web server and from a web server.

Data received from a web server is always a string.

So, we can convert a JavaScript object into a string using JSON.stringify().

Stringify a JavaScript Object

For example, we can convert this:

const obj = {name: "John", age: 30, city: "New York"};

into a string using JSON.stringify():

const myJSON = JSON.stringify(obj);

Now, myJSON is a string, and ready to be sent to a server.

note

The result will be a string following the JSON notation.

Stringify a JavaScript Array

It is also possible to stringify JavaScript arrays

const arr = ["John", "Peter", "Sally", "Jane"];
const myJSON = JSON.stringify(arr);

Storing Data

When storing data, the data has to be a certain format, and regardless of where you choose to store it, text is always one of the legal formats.

JSON makes it possible to store JavaScript objects as text.

// Storing data:  
const myObj = {name: "John", age: 31, city: "New York"};  
const myJSON = JSON.stringify(myObj);  
localStorage.setItem("testJSON", myJSON);  
  
// Retrieving data:  
let text = localStorage.getItem("testJSON");  
let obj = JSON.parse(text);  
document.getElementById("demo").innerHTML = obj.name;

Exceptions

Stringify Dates

In JSON, date objects are not allowed. The JSON.stringify() function will convert any dates into strings.

const obj = {name: "John", today: new Date(), city : "New York"};  
const myJSON = JSON.stringify(obj);

Stringify Functions

In JSON, functions are not allowed as object values.

The JSON.stringify() function will remove any functions from a JavaScript object, both the key and the value:

const obj = {name: "John", age: function () {return  30;}, city: "New York"};  
const myJSON = JSON.stringify(obj);

This can be omitted if you convert your functions into strings before running the JSON.stringify() function.

const obj = {name: "John", age: function () {return  30;}, city: "New York"};  
obj.age = obj.age.toString();  
const myJSON = JSON.stringify(obj);

note

If you send functions using JSON, the functions will lose their scope, and the receiver would have to use eval() to convert them back into functions.