Getting started with JSON (JavaScript Object Notation)

Getting started with JSON (JavaScript Object Notation)

JSON (JavaScript Object Notation) is a storage format that is completely language independent and it is used to store and transport data. It's quite an important topic as the data which we fetch from external API usually consists of Arrays of elements which are in JSON format. Getting started with JSON (JavaScript Object Notation)

JSON(JavaScript Object Notation) is a storage format that is completely language independent and it is used to store and transport data. It's quite an important topic as the data which we fetch from external API usually consists of Arrays of elements which are in JSON format.

The syntax of JSON is quite similar to the Object literal syntax which also consists of name, value pairs. But here both names, as well as values, are quoted in inverted commas.

Let us look at the example below :

//Object literals syntax
let details = {
      firstName : "John",
      lastName : "Adams",
      age : 27
}

//JSON syntax
{
      "firstName" : "Mike",
      "lastName" :  "Bush",
      "age" : 25
}

It is believed that in previous years XML format was widely used which has tags surrounding the data.The above mention JSON data in XML format is represented as below

<details>
     <firstName>Mike</firstName>
     <lastName>Bush</lastName>
     <age>25</age>
</details>

As you can see the XML format is verbose as compare to JSON i.e. for a single value "Mike", the name "firstName" is repeated twice for the opening and closing tags which is quite unnecessary. Also, the JSON can be parsed to Object literal which makes it faster to work with.

JSON is so popular that even JavaScript understands it and it has inbuilt functions to convert from JSON to object literal and vice versa.

  • Javascript provides JSON.stringify() method to convert data from object literal format to JSON format
 const objectData = {
    firstName : "Mike",
    lastName : "Bush"
 }

 const JSONdata = JSON.stringify(objectData)
 console.log(JSONdata)

Output:-

{"firstName":"Mike","lastName":"Bush"}
  • There is another method calledJSON.parse() which converts JSON format data to Object literal format
const JSONdata = '{ "firstName" : "Mike", "lastName" : "Bush"}';
const ObjectData = JSON.parse(JSONdata)

console.log(ObjectData)

Output:-

{firstName: "Mike", lastName: "Bush"}

This is what I learned when I started with JSON. Understanding fundamentals and the methods of JSON are important as they are an elemental part of accessing information with API.

Conclusion :

  • JSON syntax is similar to Object literal where both name-value pair is in inverted commas.
  • JSON.stringify() Object --> JSON
  • JSON.parse() JSON --> Object

_Thank you for your time for reading the article _

This article was originally published on sarveshkadam.tech

javascript json

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

Javascript parse json | How To Parse JSON in Javascript

Javascript json.parse() is an inbuilt function that converts text into Javascript object.  We can convert JSON string to object using json.parse() method.

JSON Tutorial For Beginners | What is JSON | Learning JSON with JavaScript

JSON Tutorial For Beginners | What is JSON | Learning JSON with JavaScript

Javascript | How To Covert Javascript Array To JSON

In this example, we will see How To Covert Javascript Array To JSON. We can convert Javascript array to json using JSON.stringify() method. At some point in your time, whatever developer you are, you need to deal with JSON data. JSON stands for Javascript Object Notation. Exchange data between client and server is straightforward using JSON.

JavaScript | Convert JSON String to JSON Object

Convert JSON string to JSON object javascript. This tutorial is the purpose to explain the best ways and examples for convert JSON string to a JSON object.

Understanding JSON in JavaScript - Learn JSON With Practical Examples

JSON stands for JavaScript Object Notation. The JSON syntax is derived from JavaScript object notation syntax, but the JSON format is text only. the code that generates JSON data can be written in any programming language, not only JavaScript.