Data Structures in JavaScript

Data structures in JavaScript are ways of organizing and storing data so that programs can access, modify, search, and process information efficiently. JavaScript provides built-in structures such as arrays, objects, Map, and Set, while more advanced structures such as stacks, queues, linked lists, trees, heaps, and graphs can be implemented using JavaScript.

Choosing an appropriate data structure can significantly affect application performance. For example, an array is useful when ordered indexed data is required, while a Map is useful when values need to be associated with keys. Understanding these structures is also important for JavaScript coding interviews and algorithmic problem solving.

Common Data Structures in JavaScript

JavaScript does not require every data structure to be created as a separate class. Several useful structures are available directly through the language and standard APIs.

• Array: Stores ordered elements using numeric indexes.
• Object: Stores properties using keys and values.
• Map: Stores key-value pairs with flexible key types.
• Set: Stores unique values.
• Stack: Follows the Last In, First Out principle.
• Queue: Follows the First In, First Out principle.
• Linked List: Stores elements as connected nodes.
• Tree: Represents hierarchical relationships.
• Heap: Supports efficient priority-based operations.
• Graph: Represents relationships between connected entities.

1. Arrays in JavaScript

An Array is one of the most commonly used data structures in JavaScript. It stores elements in an ordered collection and provides zero-based indexed access.

const languages = ["JavaScript", "Python", "Java"];

console.log(languages[0]);
console.log(languages[2]);

JavaScript arrays are dynamic, so elements can be added or removed without declaring a fixed size in advance.

const numbers = [10, 20, 30];

numbers.push(40);
numbers.unshift(5);

console.log(numbers);

Arrays are useful for ordered collections, iteration, filtering, sorting, and many algorithmic problems.

2. Objects in JavaScript

JavaScript objects store data as properties associated with keys. They are commonly used to represent structured application data.

const user = {
  id: 101,
  name: "Alice",
  role: "Developer"
};

console.log(user.name);
console.log(user.role);

Objects are especially useful when the data has named properties and a relatively simple key-value structure.

3. Map in JavaScript

The JavaScript Map object stores key-value pairs. Unlike ordinary objects, Map allows keys of different types, including objects and functions.

const scores = new Map();

scores.set("Alice", 90);
scores.set("Bob", 85);
scores.set("Charlie", 95);

console.log(scores.get("Bob"));
console.log(scores.has("Alice"));

Map is a useful choice when the application is naturally modeled as a collection of key-value relationships and requires Map-specific operations.

4. Set in JavaScript

A Set stores unique values. If the same value is added multiple times, the Set keeps only one occurrence.

const numbers = new Set();

numbers.add(10);
numbers.add(20);
numbers.add(10);

console.log(numbers);
console.log(numbers.has(20));

Set is useful for duplicate removal and efficient membership checks.

5. Stack in JavaScript

A stack follows the Last In, First Out (LIFO) principle. The most recently added element is removed first.

JavaScript arrays can be used to implement a stack with push() and pop().

const stack = [];

stack.push("Page 1");
stack.push("Page 2");
stack.push("Page 3");

console.log(stack.pop());
console.log(stack[stack.length - 1]);

Stacks are commonly used for undo functionality, browser history, expression evaluation, backtracking, and depth-first search.

6. Queue in JavaScript

A queue follows the First In, First Out (FIFO) principle. The element that enters first is normally processed first.

A simple queue can be created using an array, although repeatedly using shift() can be inefficient for large queues because remaining elements may need to be reindexed.

const queue = [];

queue.push("Task 1");
queue.push("Task 2");
queue.push("Task 3");

console.log(queue.shift());
console.log(queue.shift());

For performance-sensitive queues, a head index or a dedicated queue implementation can avoid repeatedly shifting all remaining elements.

7. Linked List in JavaScript

A linked list consists of nodes where each node stores a value and a reference to another node. Unlike an array, linked-list elements do not need to occupy adjacent positions in memory.

class Node {
  constructor(value) {
    this.value = value;
    this.next = null;
  }
}

const first = new Node(10);
const second = new Node(20);
const third = new Node(30);

first.next = second;
second.next = third;

console.log(first.next.value);
console.log(first.next.next.value);

Linked lists are useful for learning pointer-like relationships and are commonly used in data-structure and algorithm problems.

8. Tree Data Structure

A tree represents hierarchical data using nodes connected through parent-child relationships. A simple binary tree node can be represented using JavaScript objects or classes.

class TreeNode {
  constructor(value) {
    this.value = value;
    this.left = null;
    this.right = null;
  }
}

const root = new TreeNode(10);

root.left = new TreeNode(5);
root.right = new TreeNode(15);

console.log(root.value);
console.log(root.left.value);
console.log(root.right.value);

Trees are used to represent hierarchical information and support algorithms such as tree traversal and binary search tree operations.

9. Heap in JavaScript

A heap is a tree-based data structure commonly used to implement priority queues. JavaScript does not provide a built-in general-purpose Heap class, so heaps are commonly implemented using arrays.

In a binary heap, the parent-child relationships are represented using array indexes. For a zero-based array, the children of index i are typically found at 2i + 1 and 2i + 2.

10. Graph in JavaScript

A graph represents relationships between entities using vertices and edges. Graphs can be represented in JavaScript using an adjacency list or adjacency matrix.

const graph = {
  A: ["B", "C"],
  B: ["A", "D"],
  C: ["A"],
  D: ["B"]
};

console.log(graph.A);
console.log(graph.B);

Graphs are useful for modeling networks, relationships, routes, dependencies, social connections, and many other connected systems.

JavaScript Data Structures and Complexity

The exact complexity depends on the operation and implementation. The following table provides common practical expectations for JavaScript's built-in structures.

These complexity values describe typical behavior rather than a guarantee for every JavaScript engine or every operation. Performance can depend on the runtime implementation and workload.

Array vs Map vs Set

These three structures are frequently used in JavaScript applications, but each is suited to a different type of problem.

Removing Duplicates with Set

One practical use of Set is removing duplicate values from an array. Converting the Set back to an array produces a collection containing only unique values.

const numbers = [10, 20, 10, 30, 20, 40];

const uniqueNumbers = [...new Set(numbers)];

console.log(uniqueNumbers);

Frequency Counting with Map

Map can be used to count how many times each value occurs. This is a common pattern in JavaScript coding problems.

const numbers = [2, 3, 2, 5, 3, 2];

const frequency = new Map();

for (const number of numbers) {
  frequency.set(
    number,
    (frequency.get(number) || 0) + 1
  );
}

console.log(frequency);

The Map stores each distinct number as a key and its frequency as the corresponding value.

Choosing the Right Data Structure

The right JavaScript data structure depends on the operations your application performs most frequently. Consider access patterns, ordering requirements, uniqueness, memory usage, and expected data size.

• Use an Array when ordered indexed data is important.
• Use an Object for simple key-based records.
• Use a Map for general-purpose key-value relationships.
• Use a Set when duplicate values should not exist.
• Use an Array as a stack when LIFO behavior is required.
• Use a dedicated or index-based queue implementation when FIFO processing is required at scale.
• Implement a linked list when node-based operations are specifically required.
• Use trees, heaps, or graphs when the problem naturally has hierarchical, priority-based, or network relationships.

Common Mistakes with JavaScript Data Structures

• Using an Array when a Set is more appropriate for unique-value membership checks.
• Using an Object for every key-value problem without considering Map.
• Using shift() repeatedly for very large queues.
• Assuming JavaScript objects and Maps have identical behavior.
• Expecting Set or Map to provide index-based access like an Array.
• Ignoring the cost of searching an Array with methods such as includes() when the data is large.
• Choosing a data structure before identifying the application's most important operations.

Why Data Structures Matter in JavaScript

Data structures are fundamental to efficient JavaScript development. They are used in frontend applications, Node.js services, APIs, browser features, caching systems, search functionality, and algorithmic problem solving.

Learning arrays, objects, Map, Set, stacks, queues, linked lists, trees, heaps, and graphs gives developers a foundation for designing efficient solutions rather than relying on a single collection type for every problem.

Key Takeaways

• JavaScript provides several built-in data structures including Array, Object, Map, and Set.
• Arrays are useful for ordered indexed collections.
• Map is designed for key-value relationships.
• Set stores unique values.
• Arrays can implement stacks and simple queues.
• Linked lists, trees, heaps, and graphs can be implemented using JavaScript classes and objects.
• Choosing a structure based on the required operations can improve application performance.
• Data structures are important for both real-world JavaScript development and coding interviews.