Search
Close this search box.

How To Use JSON.parse() and JSON.stringify() in JavaScript

Table of Contents

How To Use JSON.parse() and JSON.stringify() in JavaScript

Introduction

The JSON object, available in all modern browsers, has two useful methods to deal with JSON-formatted content: parse and stringify. JSON.parse() takes a JSON string and transforms it into a JavaScript object. JSON.stringify() takes a JavaScript object and transforms it into a JSON string.

Here’s an example:

const myObj = {
name: 'User',
age: 6,
favoriteFood: 'Steak'
};

const myObjStr = JSON.stringify(myObj);

console.log(myObjStr);
// "{"name":"User","age":6,"favoriteFood":"Steak"}"

console.log(JSON.parse(myObjStr));
// Object {name:"User",age:6,favoriteFood:"Steak"}

And although the methods are usually used on objects, they can also be used on arrays:

const myArr = ['bacon', 'lettuce', 'tomatoes'];

const myArrStr = JSON.stringify(myArr);

console.log(myArrStr);
// "["bacon","lettuce","tomatoes"]"

console.log(JSON.parse(myArrStr));
// ["bacon","lettuce","tomatoes"]

JSON.parse()

JSON.parse() can take a function as a second argument that can transform the object values before they are returned. Here the object’s values are transformed to uppercase in the returned object of the parse method:

const user = {
name: 'User',
email: '[email protected]',
plan: 'Premium'
};
const userStr = JSON.stringify(user);

JSON.parse(userStr, (key, value) => {
if (typeof value === 'string') {
return value.toUpperCase();
}
return value;
});


Note: Trailing commas are not valid in JSON, so JSON.parse() throws an error if the string passed to it has trailing commas.

JSON.stringify()

JSON.stringify() can take two additional arguments, the first one being a replacer function and the second a String or Number value to use as a space in the returned string.

The replacer function can be used to filter out values, as any value returned as undefined will be out of the returned string:

const user = {
id: 229,
name: 'User',
email: '[email protected]'
};

function replacer(key, value) {
console.log(typeof value);
if (key === 'email') {
return undefined;
}
return value;
}

const userStr = JSON.stringify(user, replacer);
// "{"id":229,"name":"User"}"

And an example with a space argument passed-in:

const user = {
name: 'User',
email: '[email protected]',
plan: 'Pro'
};

const userStr = JSON.stringify(user, null, '...');
// "{
// ..."name": "User",
// ..."email": "[email protected]",
// ..."plan": "Pro"
// }"

Tips and tricks

In this tutorial, you have successfully learned how to use JSON.strigify() and JSON.pare() in JavaScript. If you want to learn more about JSON checkout these documents:
Json Official website

If you want a server with any operating system, get started now with VPSie and get one month for free.

This tutorial is to help you based on this original tutorial digitalocean please use our tutorial for notes and tips.

 

How to Install Remote Desktop on Ubuntu

JSON (JavaScript Object Notation) is a floaty data interchange distribution commonly used for data transmission between a server and client and storing data.

JSON.parse() is used to convert a JSON string into a JavaScript object, while JSON.stringify() transforms a JavaScript object into a JSON string.

The syntax for the JSON.parse() method is as follows: JSON.parse(text, reviver).

The reviver parameter is an optional callback function that can transform the parsed object before returning it.

The syntax for the JSON.stringify() method is as follows: JSON.stringify(value, replacer, space).

Make a Comment
Share on
Facebook
Twitter
LinkedIn
Print
VPSie Cloud service

Fast and Secure Cloud VPS Service

Try FREE
For a month

The First 1 orders gets free discount today! Try Sign up on VPSie to get a chance to get the discount.