Loading lesson path
Formula
A common use of JSON is to exchange data to/from a web server.
When sending data to a web server, the data has to be a string.You can convert any JavaScript datatype into a string with JSON.stringify().
Imagine we have this object in JavaScript:
const obj = {name: "John", age: 30, city: "New York"};JSON.stringify() to convert it into a string.
const myJSON = JSON.stringify(obj);The result will be a string following the JSON notation. myJSON is now a string, and ready to be sent to a server:
const obj = {name: "John", age: 30, city: "New York"};
const myJSON =
JSON.stringify(obj);You will learn how to send JSON to a server in the next chapters.
It is also possible to stringify JavaScript arrays: Imagine we have this array in JavaScript:
const arr = ["John", "Peter", "Sally", "Jane"];JSON.stringify() to convert it into a string.
const myJSON = JSON.stringify(arr);The result will be a string following the JSON notation. myJSON is now a string, and ready to be sent to a server:
const arr = ["John", "Peter", "Sally", "Jane"];
const myJSON =
JSON.stringify(arr);You will learn how to send a JSON string to a server in the next chapters.
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;JSON.stringify() can not only convert objects and arrays into JSON strings, it can convert any JavaScript value into a string.
Stringify a Number const num = 123e-5;
const myJSON = JSON.stringify(num);Stringify a Boolean let bool = new Boolean(1);
const myJSON = JSON.stringify(bool);In JSON, date objects are not allowed. The JSON.stringify() function will convert any Date objects into strings.
const obj = {name: "John", today: new Date(), city : "New York"};
const myJSON = JSON.stringify(obj);You can convert the string back into a date object at the receiver.
In JSON, functions are not allowed as object values.
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);
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.