Linked List vs Array When to Choose Which in DSA Javascript - Build Both Approaches

Linked List vs Array: When to Choose Which

📖 Scenario: Imagine you are managing a playlist of songs for a music app. You want to understand when to use an array or a linked list to store the songs based on how you add, remove, or access songs.

🎯 Goal: You will create a simple playlist using both an array and a linked list. You will then add songs, remove songs, and access songs to see which data structure works best for each operation.

📋 What You'll Learn

Create an array called playlistArray with 3 songs.

Create a linked list called playlistLinkedList with 3 songs.

Add a new song to the end of both the array and the linked list.

Remove the first song from both the array and the linked list.

Access the second song in both the array and the linked list.

Print the final state of both the array and the linked list.

💡 Why This Matters

🌍 Real World

Music apps, task managers, and other software often need to choose the right data structure to store lists of items efficiently.

💼 Career

Understanding when to use arrays or linked lists helps in writing efficient code and solving problems in software development and interviews.

1

Create the initial playlist using an array

Create an array called playlistArray with these exact songs: 'Song A', 'Song B', 'Song C'.

DSA Javascript

# Create the array playlistArray with 'Song A', 'Song B', 'Song C'
// Your code here

Hint

Use square brackets [] to create an array and separate songs with commas.

2

Create the initial playlist using a linked list

Create a linked list class called LinkedList with nodes that have value and next. Then create a linked list called playlistLinkedList and add nodes with these songs in order: 'Song A', 'Song B', 'Song C'.

DSA Javascript

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

class LinkedList {
  constructor() {
    this.head = null;
  }

  add(value) {
    const newNode = new Node(value);
    if (!this.head) {
      this.head = newNode;
    } else {
      let current = this.head;
      while (current.next) {
        current = current.next;
      }
      current.next = newNode;
    }
  }
}

const playlistLinkedList = new LinkedList();
// Add 'Song A', 'Song B', 'Song C' to playlistLinkedList
// Your code here

Hint

Define a Node class and a LinkedList class with an add method to add nodes at the end.

3

Add and remove songs in both playlistArray and playlistLinkedList

Add 'Song D' to the end of playlistArray using push. Add 'Song D' to the end of playlistLinkedList using the add method. Then remove the first song from playlistArray using shift. Remove the first song from playlistLinkedList by updating its head to the next node.

DSA Javascript

playlistArray.push('Song D');
playlistLinkedList.add('Song D');
// Remove the first song from playlistArray
// Remove the first song from playlistLinkedList
// Your code here

Hint

Use push and shift for arrays. For linked list, update head to remove the first node.

4

Access and print the second song in both playlists

Access the second song in playlistArray by using index 1. Access the second song in playlistLinkedList by accessing head.next.value. Then print both songs with console.log. Finally, print the full playlistArray and the linked list values in order separated by arrows (e.g., Song B -> Song C -> Song D -> null).

DSA Javascript

// Access second song in playlistArray
// Access second song in playlistLinkedList
// Print both songs
// Print full playlistArray
// Print full playlistLinkedList
// Your code here

Hint

Use array[index] to access array elements and head.next.value for linked list. Use a loop to print linked list values.

Practice

1. Which data structure is generally better for frequent insertions and deletions in the middle of the collection?

easy

A. Array

B. Neither is suitable

C. Both are equally efficient

D. Linked List

Solution

1. Step 1: Understand insertion and deletion costs in arrays

   Arrays require shifting elements when inserting or deleting in the middle, which is costly.

2. Step 2: Understand linked list insertion and deletion

   Linked lists can insert or delete nodes by changing pointers without shifting elements.

3. Final Answer:

   Linked List -> Option D

4. Quick Check:

   Insert/delete middle = Linked List [OK]

Hint: Choose linked list for fast middle insert/delete [OK]

Common Mistakes:

• Thinking arrays handle middle insertions efficiently
• Confusing array resizing with insertion cost
• Assuming linked lists have faster access

2. Which of the following is the correct way to declare an empty linked list node in JavaScript?

easy

A. const node = { value: null, next: null };

B. const node = [null, null];

C. const node = null;

D. const node = new Array();

Solution

1. Step 1: Understand linked list node structure

   A linked list node typically has a value and a pointer to the next node, represented as an object with 'value' and 'next' properties.

2. Step 2: Check each option

   const node = { value: null, next: null }; correctly creates an object with 'value' and 'next' set to null. Others do not represent a linked list node properly.

3. Final Answer:

   const node = { value: null, next: null }; -> Option A

4. Quick Check:

   Linked list node = object with value and next [OK]

Hint: Linked list nodes are objects with value and next [OK]

Common Mistakes:

• Using arrays instead of objects for nodes
• Assigning null directly without properties
• Confusing array declaration with node

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

const arr = [1, 2, 3];
arr.splice(1, 1, 4);
console.log(arr);

medium

A. [1, 4, 3]

B. [1, 2, 3]

C. [4, 2, 3]

D. [1, 3]

Solution

1. Step 1: Understand splice parameters

   arr.splice(1, 1, 4) means start at index 1, remove 1 element, then insert 4 at that position.

2. Step 2: Apply splice to array

   Original array is [1, 2, 3]. Removing element at index 1 (which is 2) and inserting 4 results in [1, 4, 3].

3. Final Answer:

   [1, 4, 3] -> Option A

4. Quick Check:

   splice replaces element at index 1 with 4 [OK]

Hint: splice(start, deleteCount, item) replaces elements [OK]

Common Mistakes:

• Thinking splice inserts without deleting
• Confusing splice with slice
• Expecting original array unchanged

4. Identify the error in the following linked list insertion code snippet:

function insertAtHead(head, value) {
  const newNode = { value: value, next: head };
  head = newNode;
  return head;
}

let head = null;
insertAtHead(head, 5);
console.log(head);

medium

A. newNode is not created correctly

B. The head variable is not updated outside the function

C. The function should not return head

D. The next pointer should be null

Solution

1. Step 1: Understand variable scope in JavaScript

   Inside the function, head is a local parameter. Assigning head = newNode changes only local copy.

2. Step 2: Check effect on external head variable

   Outside the function, head remains null because the updated head inside the function is not reflected outside.

3. Final Answer:

   The head variable is not updated outside the function -> Option B

4. Quick Check:

   Function parameter reassignment doesn't affect external variable [OK]

Hint: Return and assign new head to update linked list [OK]

Common Mistakes:

• Assuming head changes globally without return
• Not returning the new head
• Misunderstanding pointer assignment

5. You need to store a large collection of items where you frequently add elements at the end and access elements by index quickly. Which data structure should you choose and why?

hard

A. Linked List, because it allows fast access by index

B. Linked List, because it uses less memory than arrays

C. Array, because it allows fast access by index and efficient append

D. Array, because it allows fast insertion and deletion in the middle

Solution

1. Step 1: Analyze access by index requirement

   Arrays provide constant time access by index, linked lists require traversal which is slower.

2. Step 2: Analyze frequent append requirement

   Arrays can append efficiently if capacity allows; linked lists also append efficiently but slower access is a drawback.

3. Final Answer:

   Array, because it allows fast access by index and efficient append -> Option C

4. Quick Check:

   Fast index access + append = Array [OK]

Hint: Use array for fast index access and appending [OK]

Common Mistakes:

• Choosing linked list for fast index access
• Assuming linked list uses less memory always
• Confusing insertion in middle with append