We will now discuss some important methods of JSON, which are JSON.stringify() and JSON.parse().
This method accepts an argument as an object or value and returns a JSON of string type. Let's take some examples to understand this better.
Example:
const obj = { firstName: "Alan", lastName: "Cooper" } const str = JSON.stringify(obj); console.log(str);
Output:
'{"firstName":"Alan","lastName":"Cooper"}'
Explanation:
In the code snippet above, the object obj is a valid JSON having some properties. When this object is passed as an argument to the JSON.stringify() method, a JSON in the form of a string is returned, as is evident from the output given above.
Apart from giving an object as an argument, you can also provide a direct value of some type in JavaScript. This is because a direct value is also a valid JSON. Let's take another example to understand how this works.
Example:
var firstName = "Alan"; var str = JSON.stringify(firstName); console.log(str);
Output:
"Alan"
Explanation:
In the code snippet above, the string value "Alan" is passed as an argument to the JSON.stringify() method. The resultant output is again the same value in string form.
This method accepts an argument as the JSON in the string format and returns a JSON object/array. Let's understand this method using some examples.
Example:
const arr = [ { firstName: "Alan", lastName: "Cooper" }, { firstName: "Bob", lastName: "Cooper" } ] const str = JSON.stringify(arr); const parsedArr = JSON.parse(str); console.log(parsedArr);
Output:
[{firstName: "Alan", lastName: "Cooper"}, {firstName: "Bob", lastName: "Cooper"}]
Explanation:
A JSON array named arr is passed as an argument to the JSON.stringify() method. This method returns a JSON in the form of a string, which is stored in the variable named str. This stringified JSON contained in the variable str is then passed to the JSON.parse() method, which takes the JSON string and then converts (parses) it back to the normal JSON form (valid JSON array).
Now, you can easily access the parsedArr using the normal syntax in JavaScript. For example, if you want to access the firstName of the second (index = 1) element in the array, then you can write this:
parsedArr[1].firstName
This will give the following output:
"Bob"
As you learnt, JSON is a widely used data-interchange format, which is language-independent; it is widely used in transmitting data over the web. Thus, you can use JSON to transmit your request data to a server and receive the response data back from a server.
The HTTP communicates over text (string format). This gives rise to a need for the JSON to be converted to a string so that it can be transmitted with a web request. The JSON.strinfigy() method is used to do this job. It is mostly used when a request is to be sent to a server.
When a request is sent to a server, the server responds by sending some data, which is known as the response data. This data is in the form of string because as mentioned earlier, the data is transmitted in the form of text over the web. Now, in order to use the response data, you need to convert this string back to JSON so that you can extract the required information from it. This is when the JSON.parse() method is used to convert a string to the JSON format.