How to Convert JavaScript object to JSON String – With Examples?

JSON is a lightweight data-interchange format. It is used to transmit data between a server and a client.

You can convert JavaScript object to JSON string using the JSON.stringify(obj) method.

Converting a JavaScript object to JSON is also known as serializing an object to JSON String.

In this tutorial, you’ll learn different methods available to convert a JavaScript object to JSON String.

Using JSON.stringify()

You can use JSON.Stringify() method to convert a JS object to a JSON string as shown below.

var obj = eval('({'"name": "Javascript","LastName" : "Owl"'})');

JSON.stringify(obj);

eval is used to convert String into Javascript object just for demonstration purposes. It is not recommended to use eval as it will evaluate the mathematical expressions.

Output

{
"name": "Javascript",
"LastName": "Owl"
}

There is no space appended at the JSON properties’ beginning. You’ll see how to add space and indentation in the next section.

You can assign the JSON value to a text element using the .value property of the element.

text_element_id.value = JSON.stringify(obj);

This is how you can convert the object to JSON String using the Stringify() method.

Convert JavaScript Object to JSON String Pretty

The JSON stringify method supports additional parameters to support the pretty printing of the JSON string.

The stringify method parameters are

  • value – Object to convert to a json string
  • replacer – A replacer method to replace specific characters during the conversion. An optional parameter. You must pass the Null value if you want to use the space for pretty printing
  • space – Number of spaces to insert into the beginning of each JSON object property—an optional Parameter. The maximum acceptable number is 10. If you pass a value of more than 10, it will be considered 10

Code

var obj = eval('({'"name": "Javascript","LastName" : "Owl"'})');

json_text_element.value = JSON.stringify(obj, null, 7)

The above code will include seven spaces in the string to prettify it, and the JSON will look like the following.

{
       "name": "Javascript",
       "LastName": "Owl"
}

JavaScript Object VS JSON String

In JavaScript, an object is an entity.

  • Each object is of a different type, and the objects will have a set of properties.
  • You can access these properties using the. operator.

JSON Strings are strings used for storing and transporting data.

  • JSON stands for JavaScript Object Notation
  • You can use JSON in any language such as Java or Python.

JSON.stringify escaping without need

JSON.Stringify() method will accept only JavaScript Object.

If you pass a Javascript String to the Stringify() method, additional escape characters are appended to it.

For example, add the following JSON string in a text box.

"name": "Javascript","LastName" : "Owl"

Try to convert it into a JSON string using JSON.stringify(textelement.value).

You’ll see the following output with escape characters.

"\"name\": \"Javascript\",\"LastName\" : \"Owl\""

Hence, you need to be careful to pass a JSON object to a Stringify() method instead of passing JSON Strings.

You need to convert the Javascript String to JavaScript String in this case. Refer to the previous section for more details.

JS Object to JSON String without Stringify

JSON.Stringify() is the recommended method to convert js Object to JSON String.

However, if you want to convert a JavaScript object to JSON string without Stringify(), define a user-defined method as available in this StackOverflow answer.

Be aware that this doesn’t handle the undefined values for any JSON property. Using this type of method will consider undefined as a String.

Convert JavaScript object to JSON String Online

You can use online converters such as convertsimple.com to convert the javascript object to JSON String online. It also prettifies the output JSON string.

Additional Resources

Leave a Comment