• +91-9142290450

  • Hajipur, Bihar, 844101

☰
❮
❯

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 Data Types

← Previous Next →

In the previous tutorials, you learned about JSON’s structure, syntax, and how it compares with XML. Now it’s time to dive into the different types of data JSON can store.

Understanding JSON data types is essential because using the wrong type can break your application or cause unexpected behavior.

What Are JSON Data Types?

JSON supports six primary data types. Each type allows you to store different kinds of information:

  1. String

  2. Number

  3. Boolean

  4. Array

  5. Object

  6. Null

Let’s go through each type with clear examples and best practices.

1. String

A string is a sequence of characters enclosed in double quotes.

Rules for JSON strings:

  • Always use double quotes " "; single quotes ' ' are not allowed.

  • Can include letters, numbers, and special characters.

  • Must escape special characters like \n, \t, \", etc.

Example:

{
  "name": "Vicky",
  "city": "Mumbai",
  "greeting": "Hello, welcome to \"WebLearn Academy\"!"
}

Strings are the most commonly used data type in JSON.

2. Number

A number can be an integer or a floating-point value.

Rules:

  • No quotes around numbers.

  • Can be positive or negative.

  • No leading zeros.

Example:

{
  "age": 28,
  "height": 5.9,
  "temperature": -2
}

Numbers are useful for age, prices, scores, or any numerical data.

3. Boolean

A boolean represents either true or false.

Example:

{
  "isDeveloper": true,
  "hasLicense": false
}

Booleans are often used in JSON to indicate states or conditions, like whether a user is active or a product is in stock.

4. Array

An array is an ordered list of values enclosed in square brackets [ ].

Rules:

  • Can contain multiple values.

  • All values can be of different types: strings, numbers, booleans, objects, or even other arrays.

  • Values are separated by commas.

Example:

{
  "skills": ["HTML", "CSS", "JavaScript"],
  "scores": [88, 95, 72],
  "mixedArray": ["Vicky", 28, true]
}

Arrays are perfect for storing lists of items, like student names, product prices, or tasks.

5. Object

An object is a collection of key/value pairs enclosed in curly braces { }.

Rules:

  • Keys must be strings in double quotes.

  • Values can be of any valid JSON type, including other objects.

Example:

{
  "person": {
    "name": "Vicky",
    "age": 28,
    "address": {
      "city": "Mumbai",
      "zipcode": 400001
    }
  }
}

Objects are used when you need to represent structured or nested data, like a user profile or a product with multiple attributes.

6. Null

Null represents an empty or non-existent value. It is often used to indicate missing data.

Rules:

  • Written as null without quotes.

Example:

{
  "spouse": null,
  "middleName": null
}

Null is useful when a value is optional or not available yet.

Combined Example Using All Data Types

Here’s a JSON object that includes all six data types:

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

Explanation:

  • "name" → String

  • "age" → Number

  • "isDeveloper" → Boolean

  • "skills" → Array of strings

  • "address" → Object

  • "spouse" → Null

This example shows how JSON can represent complex real-world data in a structured way.

Notes on JSON Data Types

  1. Strings must always be double-quoted. Single quotes are invalid.

  2. Numbers cannot have leading zeros or be enclosed in quotes.

  3. Boolean values are not capitalized; use true or false.

  4. Null is lowercase and cannot be in quotes.

  5. Arrays and objects can be nested, allowing complex structures.

Correct usage of data types ensures JSON is valid, readable, and easy to parse in any programming language.

Why Choosing the Right Data Type Matters

  1. Parsing Accuracy – Using the wrong type can break your application when reading the JSON.
    Example: "age": "28" is a string, not a number.

  2. Data Validation – APIs often expect specific types. Sending wrong types may result in errors.

  3. Storage Efficiency – Numbers and booleans are smaller and faster to process than strings.

  4. Logical Operations – Boolean and number types allow calculations and comparisons directly.

Real-World Examples

  1. API Response for User Profile

{
  "username": "vicky123",
  "age": 28,
  "isActive": true,
  "roles": ["Admin", "Editor"],
  "address": { "city": "Mumbai", "country": "India" },
  "profilePicture": null
}

  1. Product Data

{
  "productName": "Laptop",
  "price": 55000,
  "inStock": true,
  "features": ["8GB RAM", "512GB SSD", "i5 Processor"],
  "manufacturer": { "name": "Dell", "warranty": "1 Year" },
  "discount": null
}

These examples demonstrate how different JSON data types are used together to represent structured information.

Summary of the Tutorial

  • JSON has six primary data types: String, Number, Boolean, Array, Object, Null.

  • Strings are text, numbers are numeric values, booleans represent true/false, arrays store lists, objects store structured data, and null represents empty values.

  • Arrays and objects can be nested for complex data structures.

  • Correct usage of types ensures JSON is valid, readable, and easy to parse.

Mastering JSON data types is essential because every JSON object you create in web development will use these types in some combination.

Practice Questions

  1. Create a JSON object for a user with keys: name (string), age (number), isActive (boolean), skills (array), address (object), and spouse (null). Print the user’s city using JavaScript.

  2. Write a JSON object representing a book with title (string), price (number), inStock (boolean), authors (array), and publisher (object). Access the publisher name in JavaScript.

  3. Convert this JSON string into a JavaScript object and print the second skill:

'{ "name": "Sanjana", "skills": ["HTML", "CSS", "JavaScript"] }'

  1. Write a JSON array of three products. Each product should have a name (string), price (number), and isAvailable (boolean). Print all products that are available.

  2. Create a JSON object representing a movie with title (string), year (number), cast (array), director (object), and awards (null if none). Access the director’s name in JavaScript.

  3. Identify and fix errors in this JSON:

{
  "name": "Vicky",
  "age": "28",
  "isDeveloper": True,
  "skills": ['HTML', 'CSS', 'JS'],
  "address": null,
}

  1. Write a JSON object for a school that has name (string), established (number), isPublic (boolean), classes (array of objects with className and students), and principal (null if unknown). Access the number of students in the first class.

  2. Convert the following JavaScript object to a JSON string using JSON.stringify():

let product = { name: "Laptop", price: 55000, inStock: true };

  1. Parse this JSON string and print the last element of the array:

'{ "colors": ["Red", "Green", "Blue"] }'

  1. Create a JSON object representing a user profile with username (string), age (number), isVerified (boolean), hobbies (array), and contact (object). Then update the age and add a new hobby using JavaScript.

← Previous Next →

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

codepractice logo
Login
Go Back Top