JavaScript arrays: ordered data with index access

A JavaScript array stores an ordered, integer-indexed collection of values. Use arrays when sequence matters — lists, queues, or any data where position is meaningful. Index-based access is instant (O(1)) regardless of array size, and length tracks the size automatically.

JavaScript Array Example For Creating and Accessing Data

Output:

red
3
[
  "red",
  "green",
  "blue",
  "yellow"
]

How This Example Works

1. ["red", "green", "blue"] creates a three-element array using bracket literal syntax — the standard way to define a JavaScript array with initial values.
2. colors[0] reads the first element. Arrays use zero-based indexing: index 0 is the first element, 1 is the second, and so on.
3. colors.length returns the number of elements. It updates automatically as items are added or removed.
4. colors.push("yellow") appends an element to the end. The original array is modified in place.

What Is a JavaScript Array?

JavaScript arrays are objects optimized for numeric indexes: the length property auto-updates as you add or remove elements, and built-in methods like map, filter, reduce, and forEach iterate in index order. Use Array.isArray(value) to reliably detect an array, since typeof [] returns "object".

Common Mistakes With JavaScript Arrays

Using new Array(n) to create a single-element array.

Wrong:

const items = new Array(3); // 3 empty slots, not [3]

Right:

const items = [3]; // array containing the number 3

A single numeric argument sets length and creates empty slots, not an element.

Expecting sparse arrays to iterate fully.

Wrong:

const a = Array(3).map((_, i) => i); // [empty × 3]

Right:

const a = Array.from({ length: 3 }, (_, i) => i); // [0, 1, 2]

map skips empty slots. Array.from creates defined elements, so the callback runs for each index.

Mutating vs Non-Mutating Array Methods

ES2023 added toReversed(), toSorted(), toSpliced(), and with() — non-mutating counterparts to their in-place originals. If you need both the original and sorted order, prefer toSorted() over sort().

Performance Considerations

push and pop operate at the end of the array in O(1). shift and unshift reindex every element, making them O(n). In hot loops, avoid front operations on large arrays.

More Examples

Array of arrays — access nested data:

const matrix = [[1, 2], [3, 4], [5, 6]];
console.log(matrix[1][0]); // 3

Each element is itself an array. A JavaScript array of arrays is a simple way to model a grid, and double indexing [row][col] reaches inner values.

Stack with push and pop:

const stack = [10, 20, 30];
stack.push(40);
console.log(stack.at(-1)); // 40
stack.pop();
console.log(stack);        // [ 10, 20, 30 ]

push adds to the end, pop removes from the end — both O(1). at(-1) reads the last element without knowing the length.

When to Use JavaScript Arrays

• Ordered collections where position-based access matters (lists, queues, stacks).
• Any sequence that needs to grow or shrink: push/pop for stack, push/shift for queue.
• Grouped data modeled as an array of arrays (rows, columns, matrix).
• Do not use arrays for key-value lookup — use Map or a plain object instead.
• Do not use arrays when every element must be unique — use Set.

FAQ

How do you create a JavaScript array with initial values?

Use bracket notation: const colors = ["red", "green", "blue"]. This is the preferred literal syntax. Array.of(1, 2, 3) also works but is rarely needed outside polymorphic code where new Array(n) would be ambiguous.

Which JavaScript array methods mutate the original array?

push, pop, shift, unshift, splice, sort, reverse, and fill modify the array in place. Modern alternatives like toSorted, toReversed, and toSpliced (ES2023) return new arrays without touching the original.

How do you check whether a value is an array in JavaScript?

Call Array.isArray(value). This works across iframes and realms, unlike instanceof Array, which fails when the array was created in a different execution context.