Yogesh Chauhan's Blog

JSON.stringify() in JavaScript

in JavaScript on April 8, 2022

A very brief intro on JSON

JSON = JavaScript Object Notation

JSON is just a text format to store data on your server and transport it to the user easily.

Why do we need JSON.stringify()?

To transfer data to a web server, it requires a string conversion if the data is not in a string format.

JSON.stringify() is used to convert the JavaScript object into a string.

How to stringify a JavaScript Object?

Here’s an example of a JavaScript object:


const object1 = {name: "ABC", job: "Developer", place: "London"};

This is how you can convert it to a string:


const str = JSON.stringify(object1);

This is how the final string will look like and sent over to a web server:


{"name":"ABC","job":"Developer","place":"London"};

How to stringify a JavaScript Array?

Here’s an example of a JavaScript array:


const array1 = ["ABC", "DEF", "XYZ"];

This is how you can convert it to a string:


const str = JSON.stringify(array1);

This is how the final string will look like and sent over to a web server:


["ABC","DEF","XYZ"]

Date objects are not allowed in JSON.

JSON.stringify() will convert the date object into a string which cab be converted back to the date when you receive it.

Functions will be removed from the JS object when you use JSON.stringify().

References

MDN: More examples

MDN: Browser compatibility


Most Read

#1 Solution to the error “Visual Studio Code can’t be opened because Apple cannot check it for malicious software” #2 How to add Read More Read Less Button using JavaScript? #3 How to check if radio button is checked or not using JavaScript? #4 Solution to “TypeError: ‘x’ is not iterable” in Angular 9 #5 How to uninstall Cocoapods from the Mac OS? #6 PHP Login System using PDO Part 1: Create User Registration Page

Recently Posted

#Apr 8 JSON.stringify() in JavaScript #Apr 7 Middleware in NextJS #Jan 17 4 advanced ways to search Colleague #Jan 16 Colleague UI Basics: The Search Area #Jan 16 Colleague UI Basics: The Context Area #Jan 16 Colleague UI Basics: Accessing the user interface
You might also like these
PHP Login System using PDO Part 1: Create User Registration PagePHPHow to change CSS with jQuery?CSS3 Types of Arrays in PHPPHPHow to disable right click and drag and drop of images using jQuery?jQueryHow to update database configurations in WordPress?WordPressHow to auto-resize textarea based on text input using JavaScript or jQuery?JavaScript