Introduction
Imagine you need to store a list of your top 5 favorite songs. You could create five separate variables, or you could use a single array. Arrays are the most fundamental data structure in programming, an ordered collection that lets you store and access multiple values under one name.
The code examples in this article use JavaScript's built-in array API (push, pop, etc.). The underlying concepts apply to arrays in any language, but method names may differ.
Explanation
An array stores elements in contiguous, indexed slots. Each element has a position called an index, starting at 0.
Core Operations:
Insert: Add an element to the array
Delete: Remove an element from the array
Seek: Read an element at a specific index
Traverse: Visit every element in order
Think of an array like a row of numbered lockers. Locker 0 holds the first item, locker 1 holds the second, and so on. You can jump directly to any locker if you know its number.
Let's see this in action:
const numbers = [10, 20, 30, 40, 50];
console.log('First element:', numbers[0]);
console.log('Second element:', numbers[1]);
console.log('Total elements:', numbers.length);Watch the visualization: Notice how index 0 maps to the first element. The length property always equals the highest index + 1. Arrays are zero-indexed, so a 5-element array has indices 0 through 4.
The key insight: arrays give you O(1) random access. No matter how large the array, reading any element by index takes the same amount of time.
Implementation
Creating Arrays
// Empty array
const empty = [];
// Array with initial values
const numbers = [10, 20, 30, 40, 50];
// Access by index
console.log('Element at index 2:', numbers[2]);
// Last element using length
console.log('Last element:', numbers[numbers.length - 1]);Watch the visualization: Track how numbers[2] directly jumps to index 2 without scanning through 0 and 1. That's direct access in action.
Insert Operation
push() adds an element to the end of the array in O(1). No existing elements need to move.
const numbers = [10, 20];
numbers.push(30);
console.log('After push:', numbers);
numbers.push(40);
console.log('After another push:', numbers);
console.log('Length:', numbers.length);Watch the visualization: Each push() places the new element at the next available slot at the end. The length grows by 1 each time, but nothing else shifts.
Delete Operation
pop() removes and returns the last element in O(1). Like push, no other elements are affected.
const numbers = [10, 20, 30, 40];
const last = numbers.pop();
console.log('Removed:', last);
console.log('After pop:', numbers);
const second = numbers.pop();
console.log('Removed:', second);
console.log('After pop:', numbers);Watch the visualization: Each pop() removes from the end and the length shrinks by 1. The remaining elements stay exactly where they are, so no shifting occurs.
Seek Operation
Seeking retrieves an element directly by its index in O(1). No scanning required because the array computes the exact memory location instantly.
const numbers = [10, 20, 30, 40, 50];
console.log('Element at index 0:', numbers[0]);
console.log('Element at index 3:', numbers[3]);
console.log('Last element:', numbers[numbers.length - 1]);Watch the visualization: Whether you seek index 0 or index 4, the operation takes the same amount of time. That's the power of index-based access.
Traverse Operation
Traversal visits every element in the array from index 0 to the last. Unlike seek, you don't know which index you want, so you need to process all of them. This costs O(n) since you touch every element once.
const numbers = [10, 20, 30];
let total = 0;
for (let i = 0; i < numbers.length; i++) {
console.log(`Index ${i}: ${numbers[i]}`);
total += numbers[i];
}
console.log('Total:', total);Watch the visualization: The index i steps through 0, 1, 2 in order, and every element is visited exactly once. The more elements in the array, the longer a traversal takes.
Complexity
Time Complexity
Seek (access by index): O(1), direct jump to memory location
Insert (push to end): O(1), no shifting needed
Delete (pop from end): O(1), no shifting needed
Traverse: O(n), every element is visited once
Space Complexity
O(n), where n is the number of elements stored in the array
Found this helpful? Share it with a developer just starting out with data structures. Got questions? We'd love to hear from you at [email protected]
