What is JSON?

JSON is an acronym standing for JavaScript Object Notation. JSON is a lightweight and language-independent format used for data interchanging in plain text. According to JSON being in plain text and very popular, most programming languages support JSON out of the box as they can read and parse JSON data into their own easily. The file extension for JSON is .json, and the MIME type is application/json.

The following is an example of JSON data representing the information of the JavaScript programming language.

{
  "name": "JavaScript",
  "creator": "Brendan Eich",
  "year": 1995,
  "extensions": [
    ".js",
    ".mjs"
  ]
}

The JSON syntax

The JSON syntax is pretty straightforward, human-friendly, and readable because it's a subset of the familiar JavaScript syntax. The following are the basic rules of the JSON syntax.

• JSON data is written as key and value pairs "key": "value".
• Each JSON data is separated by a comma ,.
• Curly braces {} are used for creating JSON objects.
• Square brackets [] are used for creating JSON arrays.

The JSON data types

Basically, JSON's data types are similar to that of JavaScript. There are six data types used in JSON as listed below.

• String - Unicode characters from zero to any length enclosed by double quotes "".
• Number - A decimal number whether it be integer or float. There is no difference between integer and float in the JSON format.
• Boolean - A boolean value that can be either true or false.
• Array - A list of zero or more values enclosed by square brackets []. Each value in an array is separated by a comma ,.
• Object - Data written as key and value pairs enclosed by curly braces {}. The keys are in the string format enclosed by double quotes "" whereas the values can be anything.
• Null - An empty value written as null.

JSON completely ignores whitespace characters. There are four types of whitespace characters in JSON; i.e. space, tab, newline \n, and carriage return \r. Please note that JSON does not support function, date, and undefined data types, or even comments unlike JavaScript.

What is the use of JSON?

JSON is mostly used for creating APIs. As you already know that JSON data is in plain text, it can be transmitted over the internet easily. Webs and apps nowadays use JSON for data interchanging between the server and client via APIs.

Moreover, you can use json to create a local config file within your app, such as config.json like so.

{
  "host": "example.com",
  "port": 1234,
  "username": "admin",
  "password": "9auBQmHT"
}

How to parse JSON data to a JavaScript object

Basically, JSON is part of JavaScript. Therefore, you can easily convert between JSON data and JavaScript objects without having to install any third-party libraries. There is the built-in function named JSON.parse in JavaScript that lets you parse a string representing JSON data to the corresponding JavaScript object. The string must be written in the correct JSON format so that it can be converted successfully.

// Please note that this JSON data is in a string format.
const data = `{
  "name": "John",
  "gender": "male",
  "age": 25
}`;

// Use the built-in JSON.parse function to parse JSON data to a JavaScript object.
const obj = JSON.parse(data);

console.log(obj); // { name: "John", gender: "male", age: 25 }

How to convert a JavaScript object to JSON data

Similar to parsing JSON data to a JavaScript object above, you can also convert a JavaScript object to JSON data easily using the built-in JSON.stringify function. Please note that the output JSON data will be in plain text with escaped characters.

const obj = {
  name: 'John',
  gender: 'male',
  age: 25,
};

// Use the built-in JSON.stringify function to convert a JavaScript object to JSON data.
const data = JSON.stringify(obj);

// The output JSON data is in a string format with backslash escapes.
console.log(data); // "{\"name\":\"John\",\"gender\":\"male\",\"age\":25}"

Why format JSON?

JSON data is mostly minified when used in production so that it can help reduce the transfer bandwidth. However, minified JSON data is not human-friendly and readable. Sometimes when you're debugging an API that returns JSON data, you'll probably need a tool like JSON Formatter to properly format it so that you can read the returned JSON data with ease.

Why minify JSON?

JSON minification is the process of removing any unnecessary characters, such as white spaces, tabs, and new lines from JSON data in order to make it compact for production use without touching or changing its original data and functionality. JSON minification immensely helps reduce the file size so that bandwidth usage will be a lot less when transmitting over the internet.

For example, here is the minified version of the JSON data above. As you can see, the JSON data is reduced into one single line with all the unnecessary characters removed.

{"name":"JavaScript","creator":"Brendan Eich","year":1995,"extensions":[".js",".mjs"]}