JSON Arrays

A JSON array is an ordered list of values enclosed in square brackets [ ]. It is used when a key needs to hold multiple values instead of just one. Think of an array as a numbered list — like a list of students in a class, a list of cities, or a list of products in a shopping cart.

Each value in an array is called an element, and elements are separated by commas. The order of elements is preserved, meaning the first element always stays first.

Basic Structure of a JSON Array

["value1", "value2", "value3"]

An array is usually the value of a key inside a JSON object:

{
  "fruits": ["apple", "banana", "mango"]
}

Array of Strings

A simple array where all elements are strings:

{
  "languages": ["Hindi", "English", "Tamil", "Bengali"]
}

Array of Numbers

An array where all elements are numbers:

{
  "scores": [88, 76, 92, 65, 80]
}

Array of Booleans

An array where all elements are boolean values:

{
  "questionResults": [true, false, true, true, false]
}

Array of Mixed Data Types

JSON arrays can hold values of different types in the same list. This is called a mixed array:

{
  "details": ["Rohit", 24, true, null]
}

Although allowed, it is generally better practice to keep arrays consistent with the same data type for clarity.

Array of Objects

One of the most common and powerful uses of JSON arrays is to hold a list of objects. This is how JSON represents a collection of records — like a list of students, employees, or products.

{
  "students": [
    {
      "name": "Aisha",
      "grade": "A"
    },
    {
      "name": "Ravi",
      "grade": "B"
    },
    {
      "name": "Pooja",
      "grade": "A"
    }
  ]
}

Here, "students" is an array containing three objects. Each object has its own set of key-value pairs.

Accessing Array Elements in JavaScript

Array elements are accessed using their index position. JSON arrays are zero-indexed, meaning the first element is at index 0, the second at index 1, and so on.

const data = {
  "fruits": ["apple", "banana", "mango"]
};

console.log(data.fruits[0]);  // Output: apple
console.log(data.fruits[1]);  // Output: banana
console.log(data.fruits[2]);  // Output: mango

Accessing Values from an Array of Objects

const classData = {
  "students": [
    { "name": "Aisha", "grade": "A" },
    { "name": "Ravi", "grade": "B" }
  ]
};

console.log(classData.students[0].name);   // Output: Aisha
console.log(classData.students[1].grade);  // Output: B

Finding the Length of an Array

The .length property returns the total number of elements in an array:

const data = {
  "cities": ["Delhi", "Mumbai", "Chennai", "Kolkata"]
};

console.log(data.cities.length);  // Output: 4

Looping Through a JSON Array

To process all elements of an array, use a forEach loop or a for loop:

const data = {
  "colors": ["red", "green", "blue"]
};

data.colors.forEach(function(color) {
  console.log(color);
});

// Output:
// red
// green
// blue

Nested Arrays

An array can also contain other arrays inside it. These are called nested arrays or multi-dimensional arrays:

{
  "matrix": [
    [1, 2, 3],
    [4, 5, 6],
    [7, 8, 9]
  ]
}

To access the value 5:

console.log(data.matrix[1][1]);  // Output: 5

Difference Between JSON Objects and JSON Arrays

Key Points to Remember

• JSON arrays use square brackets [ ]
• Elements in an array are separated by commas
• Array indexing starts at 0
• Arrays can hold strings, numbers, booleans, null, objects, or even other arrays
• Arrays of objects are very commonly used to represent lists of records
• Order of elements in an array is always maintained

Summary

JSON arrays are a powerful way to store multiple values under a single key. Whether it is a simple list of names or a complex collection of objects, arrays make it easy to organise and access multiple records. Understanding arrays is essential for working with real-world JSON data returned from APIs and databases.