JavaScript

coding learning websites codepractice

JS Basics

JS Variables & Operators

JS Data Types & Conversion

JS Numbers & Math

JS Strings

JS Dates

JS Arrays

JS Control Flow

JS Loops & Iteration

JS Functions

JS Objects

JS Classes & Modules

JS Async Programming

JS Advanced

JS HTML DOM

JS BOM (Browser Object Model)

JS Web APIs

JS AJAX

JS JSON

JS Graphics & Charts

JSON Syntax


In the previous tutorial, you learned what JSON is and why it’s so widely used.
Now let’s understand how to write JSON correctly.

JSON syntax looks simple, but it follows very strict rules. Even a missing comma or an extra quotation mark can make it invalid. In this tutorial, you’ll learn all the essential rules and patterns that define how JSON data should be structured.

What Is JSON Syntax?

The syntax of JSON means the set of rules you must follow when writing JSON data.
JSON syntax is almost identical to JavaScript object notation, but with a few strict rules that make it language-independent.

Let’s start with a simple valid JSON example:

{
  "name": "Vicky",
  "age": 28,
  "isDeveloper": true,
  "skills": ["HTML", "CSS", "JavaScript"]
}

At first glance, this might look just like a JavaScript object, but JSON is pure text.
That’s what makes it easy to send between a browser and a server.

Basic JSON Syntax Rules

Here are the core rules you should always remember while writing JSON:

  1. Data is written in name/value pairs

  2. Data is separated by commas

  3. Curly braces {} hold objects

  4. Square brackets [] hold arrays

  5. Names (keys) must be in double quotes

  6. Values must follow specific types

  7. No trailing commas allowed

Let’s go through each rule in detail with examples.

1. Data Is Written in Name/Value Pairs

Every piece of data in JSON is stored as a name/value pair (also called a key/value pair).

Example:

"name": "Vicky"

Here:

  • "name" is the key

  • "Vicky" is the value

A JSON object can contain multiple such pairs, separated by commas:

{
  "name": "Vicky",
  "age": 28,
  "city": "Mumbai"
}

2. Data Is Separated by Commas

When you have more than one pair in a JSON object, each must be separated by a comma ,.

✅ Correct:

{
  "name": "Vicky",
  "age": 28,
  "city": "Mumbai"
}

❌ Incorrect (missing comma):

{
  "name": "Vicky"
  "age": 28
}

Even one missing comma will make the JSON invalid.

3. Curly Braces {} Hold Objects

An object in JSON always starts and ends with curly braces {}.
It contains one or more key/value pairs inside.

Example:

{
  "firstName": "Vicky",
  "lastName": "Singhaniya"
}

You can also have nested objects — an object inside another object.

Example:

{
  "employee": {
    "name": "Vicky",
    "role": "Developer"
  }
}

4. Square Brackets [] Hold Arrays

An array in JSON is used to store multiple values.
Arrays always start and end with square brackets [].

Example:

{
  "languages": ["HTML", "CSS", "JavaScript"]
}

Arrays can also contain objects.

Example:

{
  "employees": [
    { "name": "Vicky", "age": 28 },
    { "name": "Sanjana", "age": 26 }
  ]
}

5. Names (Keys) Must Be in Double Quotes

This is one of the most important rules.
In JavaScript objects, you can sometimes skip quotes around property names.
But in JSON, keys must always be in double quotes.

✅ Correct:

{
  "name": "Vicky"
}

❌ Incorrect (missing quotes):

{
  name: "Vicky"
}

Single quotes ' ' are not allowed either.

❌ Incorrect:

{
  'name': 'Vicky'
}

Always use double quotes around both keys and string values.

6. Values Must Follow Specific Types

In JSON, a value must be one of the following six valid types:

Type Example
String "Vicky"
Number 28
Boolean true or false
Object { "city": "Mumbai" }
Array ["HTML", "CSS", "JS"]
null null

Here’s an example containing all types together:

{
  "name": "Vicky",
  "age": 28,
  "isDeveloper": true,
  "skills": ["HTML", "CSS", "JS"],
  "address": { "city": "Mumbai", "pincode": 400001 },
  "spouse": null
}

This example is perfectly valid JSON because it follows all type rules.

7. No Trailing Commas

One of the most common mistakes beginners make is adding a comma at the end of the last pair.

❌ Incorrect:

{
  "name": "Vicky",
  "age": 28,
}

✅ Correct:

{
  "name": "Vicky",
  "age": 28
}

Trailing commas make JSON invalid and will cause parsing errors.

Example of a Complete JSON Structure

Here’s a properly formatted JSON example that combines all these rules:

{
  "company": "WebLearn Academy",
  "founded": 2020,
  "isActive": true,
  "departments": ["Development", "Design", "Marketing"],
  "employees": [
    { "name": "Vicky", "role": "Developer" },
    { "name": "Sanjana", "role": "Designer" }
  ],
  "address": {
    "city": "Pune",
    "country": "India"
  },
  "contact": null
}

This JSON file:

  • Starts and ends with {} (object)

  • Uses double quotes for all keys and strings

  • Uses commas correctly between pairs

  • Includes valid data types only

JSON Comments Are Not Allowed

In JavaScript, you can add comments like // or /* */.
But JSON does not support comments.

❌ Incorrect:

{
  // This is my JSON
  "name": "Vicky"
}

If you need to explain something inside JSON, add a separate field like this:

✅ Correct:

{
  "name": "Vicky",
  "_note": "This data is for testing purpose only"
}

Using underscore _ or a similar convention helps you add notes safely.

Common JSON Mistakes

Here are some typical beginner errors you should avoid:

Mistake Example Reason
Missing quotes { name: "Vicky" } Keys must be in double quotes
Single quotes { 'name': 'Vicky' } JSON supports only double quotes
Trailing comma { "age": 28, } Last item cannot have a comma
Extra curly/square bracket { "skills": ["HTML", "CSS"] } } Improper structure
Wrong data type { "age": "twenty" } Numbers should not be in quotes

JSON Validator

Because JSON has strict syntax rules, a small typo can break the entire data.
To avoid mistakes, you can use a JSON validator tool such as:

These tools let you paste your JSON and instantly check if it’s valid or not.
They also help format (beautify) the data for better readability.

Summary of the Tutorial

Let’s quickly recap what you learned in this lesson:

  • JSON syntax is based on key/value pairs.

  • All keys and string values must be in double quotes.

  • JSON objects are inside {} and arrays are inside [].

  • Allowed value types are: string, number, boolean, object, array, and null.

  • No trailing commas or comments are allowed.

  • JSON must always be well-structured and properly formatted.

When you stick to these rules, your JSON will always be valid and easy to work with in any programming language.


Practice Questions

  1. Create a JSON object that contains your personal information: name, age, email, and skills (as an array). Make sure to follow correct JSON syntax rules.

  2. Write a JSON object for a company that has keys: companyName, foundedYear, and employees (an array of objects with name and role).

  3. Identify and correct the error in this JSON code:

{
  name: "Vicky",
  "age": 28,
}
  1. Create a JSON object representing a student with nested data for address (street, city, country). Print the city value using JavaScript.

  2. Convert the following JavaScript object into a JSON string:

let person = { name: "Sanjana", age: 24, city: "Delhi" };
  1. Parse this JSON string into a JavaScript object and print the “price” value:

'{ "item": "Laptop", "price": 55000 }'
  1. Write a JSON object that contains a list of three books. Each book should have a title, author, and price.

  2. Create a JSON array of products, each having id, name, and availability (true/false). Write JavaScript code to print all available products.

  3. Write a valid JSON structure that represents a user profile containing:

  • username

  • password

  • isActive

  • favoriteColors (array)

  • address (nested object with city and country)

  1. Fix the syntax errors in this JSON data:

{
  "students": [
    { "name": "Riya", "score": 90 },
    { "name": "Amit", "score": 85, }
  ],
  "status": "active",
}

JavaScript

online coding class codepractice

JS Basics

JS Variables & Operators

JS Data Types & Conversion

JS Numbers & Math

JS Strings

JS Dates

JS Arrays

JS Control Flow

JS Loops & Iteration

JS Functions

JS Objects

JS Classes & Modules

JS Async Programming

JS Advanced

JS HTML DOM

JS BOM (Browser Object Model)

JS Web APIs

JS AJAX

JS JSON

JS Graphics & Charts

Go Back Top