Adjacency List vs Matrix When to Choose Which in DSA Javascript - Interactive Comparison Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to create an adjacency list for a graph with 3 nodes.

DSA Javascript

const graph = {
  0: [],
  1: [],
  2: []
};
graph[0].push([1]);
console.log(graph);

Drag options to blanks, or click blank then click option'

A3

B2

C1

D0

Attempts:

3 left

💡 Hint

Common Mistakes

Adding a node that does not exist in the graph.

Using the wrong index for the neighbor.

We add node 1 as a neighbor to node 0 in the adjacency list.

2fill in blank

medium

Complete the code to initialize a 3x3 adjacency matrix with zeros.

DSA Javascript

const size = 3;
const matrix = Array(size).fill(null).map(() => Array(size).fill([1]));
console.log(matrix);

Drag options to blanks, or click blank then click option'

Anull

B1

Cundefined

D0

Attempts:

3 left

💡 Hint

Common Mistakes

Using 1 instead of 0, which means an edge exists.

Using null or undefined which can cause errors.

Adjacency matrices start with 0 to show no edges between nodes.

3fill in blank

hard

Fix the error in the code that adds an edge in the adjacency matrix.

DSA Javascript

const matrix = [
  [0, 0, 0],
  [0, 0, 0],
  [0, 0, 0]
];
matrix[0][[1]] = 1;
console.log(matrix);

Drag options to blanks, or click blank then click option'

A2

B1

C0

D3

Attempts:

3 left

💡 Hint

Common Mistakes

Using index 3 which is out of bounds.

Using index 1 which points to the wrong node.

Index 2 is the correct column to add an edge from node 0 to node 2.

4fill in blank

hard

Fill both blanks to create an adjacency list and add an edge from node 1 to node 2.

DSA Javascript

const graph = {
  0: [],
  1: [],
  2: []
};
graph[[1]].push([2]);
console.log(graph);

Drag options to blanks, or click blank then click option'

A1

B2

C0

D3

Attempts:

3 left

💡 Hint

Common Mistakes

Swapping source and destination nodes.

Using a node index that does not exist.

We add node 2 as a neighbor to node 1 in the adjacency list.

5fill in blank

hard

Fill all three blanks to add an edge in the adjacency matrix from node 2 to node 0.

DSA Javascript

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

Drag options to blanks, or click blank then click option'

A2

B0

C1

Dtrue

Attempts:

3 left

💡 Hint

Common Mistakes

Using true instead of 1 for the edge value.

Swapping row and column indices.

We set matrix[2][0] = 1 to show an edge from node 2 to node 0.

Practice

1. Which data structure is generally better for representing a graph with many nodes but few edges?

easy

A. Adjacency Matrix

B. Adjacency List

C. Array

D. Stack

Solution

1. Step 1: Understand graph density

   A graph with many nodes but few edges is called a sparse graph.

2. Step 2: Choose efficient representation for sparse graphs

   Adjacency lists store only existing edges, saving space for sparse graphs.

3. Final Answer:

   Adjacency List -> Option B

4. Quick Check:

   Sparse graph = Adjacency List [OK]

Hint: Sparse graphs use adjacency lists for space efficiency [OK]

Common Mistakes:

• Choosing adjacency matrix for sparse graphs wastes space
• Confusing adjacency list with adjacency matrix
• Thinking arrays or stacks represent graphs directly

2. Which of the following is the correct syntax to initialize an empty adjacency list for a graph with 3 nodes in JavaScript?

easy

A. const graph = [[], [], []];

B. const graph = [[0,0,0],[0,0,0],[0,0,0]];

C. const graph = new Array(3).fill([]);

D. const graph = {};

Solution

1. Step 1: Understand adjacency list structure

   An adjacency list is an array where each element is an array of neighbors.

2. Step 2: Check each option

   const graph = [[], [], []]; creates separate empty arrays for each node. const graph = new Array(3).fill([]); fills with the same array reference, causing bugs.

3. Final Answer:

   const graph = [[], [], []]; -> Option A

4. Quick Check:

   Separate empty arrays = const graph = [[], [], []]; [OK]

Hint: Use separate empty arrays, not fill with one array [OK]

Common Mistakes:

• Using fill([]) which shares the same array reference
• Using adjacency matrix syntax for adjacency list
• Using an object instead of array for adjacency list

3. What will be the output of the following JavaScript code snippet?

const graph = [
  [1, 2],
  [0],
  [0]
];
console.log(graph[0]);

medium

A. [0, 1, 2]

B. [0]

C. [1, 2]

D. undefined

Solution

1. Step 1: Understand the adjacency list structure

   graph[0] contains the neighbors of node 0, which are nodes 1 and 2.

2. Step 2: Check the console.log output

   Logging graph[0] prints the array [1, 2].

3. Final Answer:

   [1, 2] -> Option C

4. Quick Check:

   graph[0] = [1, 2] [OK]

Hint: Access adjacency list by index to get neighbors [OK]

Common Mistakes:

• Confusing adjacency list with adjacency matrix output
• Expecting all nodes instead of neighbors
• Mistaking graph[0] as undefined

4. Identify the error in this adjacency matrix initialization code for a graph with 3 nodes:

const graph = new Array(3).fill(new Array(3).fill(0));
graph[0][1] = 1;
console.log(graph);

medium

A. The inner arrays are shared references causing all rows to change

B. The graph array is not initialized with zeros

C. The syntax for new Array is incorrect

D. The assignment graph[0][1] = 1 is invalid

Solution

1. Step 1: Analyze array initialization

   Using fill with new Array(3).fill(0) creates one inner array shared by all rows.

2. Step 2: Effect of modifying graph[0][1]

   Changing graph[0][1] changes the same element in all rows because they reference the same array.

3. Final Answer:

   The inner arrays are shared references causing all rows to change -> Option A

4. Quick Check:

   Shared inner arrays cause unexpected changes [OK]

Hint: Use loop or map to create separate inner arrays [OK]

Common Mistakes:

• Assuming fill creates independent arrays
• Ignoring shared reference problem
• Thinking syntax is wrong instead of logic

5. You have a graph with 1000 nodes and about 10,000 edges. Which representation is more efficient in terms of memory and why? Choose the best option.

hard

A. Adjacency Matrix, because it allows O(1) edge checks

B. Adjacency List, because it stores all possible edges

C. Adjacency Matrix, because it is simpler to implement

D. Adjacency List, because it uses memory proportional to edges

Solution

1. Step 1: Calculate graph density

   Maximum edges for 1000 nodes is 1,000,000 (1000*1000). 10,000 edges is sparse.

2. Step 2: Compare memory usage

   Adjacency matrix uses memory for all possible edges (1,000,000). Adjacency list uses memory proportional to actual edges (10,000).

3. Step 3: Choose efficient representation

   Adjacency list is more memory efficient for sparse graphs.

4. Final Answer:

   Adjacency List, because it uses memory proportional to edges -> Option D

5. Quick Check:

   Sparse graph = Adjacency List memory efficient [OK]

Hint: Sparse large graph? Use adjacency list for memory [OK]

Common Mistakes:

• Choosing adjacency matrix for sparse graphs wastes memory
• Confusing simplicity with efficiency
• Thinking adjacency list stores all possible edges