-
Hajipur, Bihar, 844101
Hajipur, Bihar, 844101
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 Functions
Function Definitions
Function Parameters
Function Invocation
Function Call
Function Apply
Function Bind
Function Closures
JS Arrow Function
JS Objects
JS Objects
JS Object Properties
JS Object Methods
JS Object Display
JS Object Constructors
Object Definitions
Object Get / Set
Object Prototypes
Object Protection
JS Classes & Modules
JS Async Programming
JS Advanced
JS Destructuring
JS Bitwise
JS RegExp
JS Precedence
JS Errors
JS Scope
JS Hoisting
JS Strict Mode
JS this Keyword
JS HTML DOM
DOM Intro
DOM Methods
DOM Document
DOM Elements
DOM HTML
DOM Forms
DOM CSS
DOM Animations
DOM Events
DOM Event Listener
DOM Navigation
DOM Nodes
DOM Collections
DOM Node Lists
JS BOM (Browser Object Model)
JS Web APIs
Web API Intro
Web Validation API
Web History API
Web Storage API
Web Worker API
Web Fetch API
Web Geolocation API
JS AJAX
AJAX Intro
AJAX XMLHttp
AJAX Request
AJAX Response
AJAX XML File
AJAX PHP
AJAX ASP
AJAX Database
AJAX Applications
AJAX Examples
JS JSON
JSON Intro
JSON Syntax
JSON vs XML
JSON Data Types
JSON Parse
JSON Stringify
JSON Objects
JSON Arrays
JSON Server
JSON PHP
JSON HTML
JSON JSONP
JS Graphics & Charts
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.
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.
Here are the core rules you should always remember while writing JSON:
Data is written in name/value pairs
Data is separated by commas
Curly braces {}
hold objects
Square brackets []
hold arrays
Names (keys) must be in double quotes
Values must follow specific types
No trailing commas allowed
Let’s go through each rule in detail with examples.
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"
}
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.
{}
Hold ObjectsAn 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"
}
}
[]
Hold ArraysAn 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 }
]
}
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.
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.
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.
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
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.
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 |
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.
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.
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.
Write a JSON object for a company that has keys: companyName, foundedYear, and employees (an array of objects with name and role).
Identify and correct the error in this JSON code:
{
name: "Vicky",
"age": 28,
}
Create a JSON object representing a student with nested data for address (street, city, country). Print the city value using JavaScript.
Convert the following JavaScript object into a JSON string:
let person = { name: "Sanjana", age: 24, city: "Delhi" };
Parse this JSON string into a JavaScript object and print the “price” value:
'{ "item": "Laptop", "price": 55000 }'
Write a JSON object that contains a list of three books. Each book should have a title, author, and price.
Create a JSON array of products, each having id, name, and availability (true/false). Write JavaScript code to print all available products.
Write a valid JSON structure that represents a user profile containing:
username
password
isActive
favoriteColors (array)
address (nested object with city and country)
Fix the syntax errors in this JSON data:
{
"students": [
{ "name": "Riya", "score": 90 },
{ "name": "Amit", "score": 85, }
],
"status": "active",
}
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 Functions
Function Definitions
Function Parameters
Function Invocation
Function Call
Function Apply
Function Bind
Function Closures
JS Arrow Function
JS Objects
JS Objects
JS Object Properties
JS Object Methods
JS Object Display
JS Object Constructors
Object Definitions
Object Get / Set
Object Prototypes
Object Protection
JS Classes & Modules
JS Async Programming
JS Advanced
JS Destructuring
JS Bitwise
JS RegExp
JS Precedence
JS Errors
JS Scope
JS Hoisting
JS Strict Mode
JS this Keyword
JS HTML DOM
DOM Intro
DOM Methods
DOM Document
DOM Elements
DOM HTML
DOM Forms
DOM CSS
DOM Animations
DOM Events
DOM Event Listener
DOM Navigation
DOM Nodes
DOM Collections
DOM Node Lists
JS BOM (Browser Object Model)
JS Web APIs
Web API Intro
Web Validation API
Web History API
Web Storage API
Web Worker API
Web Fetch API
Web Geolocation API
JS AJAX
AJAX Intro
AJAX XMLHttp
AJAX Request
AJAX Response
AJAX XML File
AJAX PHP
AJAX ASP
AJAX Database
AJAX Applications
AJAX Examples
JS JSON
JSON Intro
JSON Syntax
JSON vs XML
JSON Data Types
JSON Parse
JSON Stringify
JSON Objects
JSON Arrays
JSON Server
JSON PHP
JSON HTML
JSON JSONP
JS Graphics & Charts