Creating a Singly Linked List from Scratch in DSA Javascript - Code It Step by Step

Creating a Singly Linked List from Scratch

📖 Scenario: Imagine you want to keep track of a list of tasks you need to do, but you want to add them one by one and be able to see them in order. A singly linked list is like a chain where each task points to the next one.

🎯 Goal: You will build a simple singly linked list in JavaScript from scratch. You will create nodes, link them together, and print the list to see all tasks in order.

📋 What You'll Learn

Create a Node class with value and next properties

Create a LinkedList class with a head property

Add a method to add new nodes to the end of the list

Add a method to print all node values in order

💡 Why This Matters

🌍 Real World

Linked lists are used in many programs to manage ordered data where you add or remove items often, like task lists, music playlists, or undo history.

💼 Career

Understanding linked lists helps you work with low-level data structures and improves problem-solving skills for coding interviews and software development.

1

Create the Node class

Create a class called Node with a constructor that takes a parameter value. Inside the constructor, set this.value to value and this.next to null.

DSA Javascript

// Your code here
// Create the Node class with constructor(value) and set this.value and this.next

Hint

Think of each node as a box holding a value and a pointer to the next box. The pointer starts as null because it does not point to anything yet.

2

Create the LinkedList class with head

Create a class called LinkedList with a constructor that sets this.head to null.

DSA Javascript

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

// Your code here
// Create the LinkedList class with constructor() and set this.head to null

Hint

The linked list starts empty, so the head points to nothing (null).

3

Add method to append nodes

Inside the LinkedList class, add a method called append that takes a parameter value. This method should create a new Node with value. If this.head is null, set this.head to the new node. Otherwise, loop through the list until you find the last node (where next is null) and set its next to the new node.

DSA Javascript

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

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

    // Your code here
    // Add append(value) method to add nodes at the end
}

Hint

Think of walking through the chain until you reach the last box, then attach the new box there.

4

Add method to print the list and display it

Inside the LinkedList class, add a method called printList that loops through the nodes starting from this.head and collects their value in a string separated by -> . After the loop, add null at the end. Then, create a linked list, append the values 10, 20, and 30, and print the list using printList().

DSA Javascript

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

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

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

    // Your code here
    // Add printList() method and create list, append 10, 20, 30, then print
}

Hint

Collect values as you walk through the list, then print them all joined by arrows and ending with null.

Practice

1. What is the main purpose of a Singly Linked List in data structures?

easy

A. To store elements with random access by index

B. To store elements in a tree-like hierarchy

C. To store elements in a linear order where each element points to the next one

D. To store elements in a fixed-size array

Solution

1. Step 1: Understand the structure of a singly linked list

   A singly linked list stores elements in nodes where each node points to the next node, forming a chain.

2. Step 2: Compare with other data structures

   Unlike arrays or trees, singly linked lists do not support random access or hierarchical storage.

3. Final Answer:

   To store elements in a linear order where each element points to the next one -> Option C

4. Quick Check:

   Singly linked list = linear chain of nodes [OK]

Hint: Remember: singly linked list is a chain of nodes [OK]

Common Mistakes:

• Confusing linked list with arrays
• Thinking linked list supports random access
• Mixing linked list with tree structures

2. Which of the following is the correct way to define a Node class for a singly linked list in JavaScript?

easy

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

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

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

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

Solution

1. Step 1: Identify the correct property assignments for a node

   A node should store the given value and have a pointer to the next node, initially null.

2. Step 2: Check each option's constructor

   class Node { constructor(value) { this.value = value; this.next = null; } } correctly assigns value and sets next to null. Others assign incorrectly or swap properties.

3. Final Answer:

   class Node { constructor(value) { this.value = value; this.next = null; } } -> Option B

4. Quick Check:

   Node stores value and next pointer [OK]

Hint: Node must store value and next=null initially [OK]

Common Mistakes:

• Swapping value and next assignments
• Not initializing next to null
• Leaving value or next undefined

3. What will be the output after running this code?

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;
    }
  }
  print() {
    let current = this.head;
    let result = '';
    while (current) {
      result += current.value + ' -> ';
      current = current.next;
    }
    result += 'null';
    console.log(result);
  }
}

const list = new LinkedList();
list.add(10);
list.add(20);
list.add(30);
list.print();

medium

A. 10 -> 20 -> 30 -> null

B. 30 -> 20 -> 10 -> null

C. 10 -> 20 -> null

D. null

Solution

1. Step 1: Trace the add method calls

   Adding 10 sets head to node with value 10. Adding 20 and 30 appends nodes at the end.

2. Step 2: Trace the print method

   Print traverses from head: 10, then 20, then 30, then null.

3. Final Answer:

   10 -> 20 -> 30 -> null -> Option A

4. Quick Check:

   Nodes added in order, printed in order [OK]

Hint: Add appends at end; print shows nodes in insertion order [OK]

Common Mistakes:

• Assuming add inserts at head
• Printing nodes in reverse order
• Missing last node in print

4. Identify the error in this linked list add method and select the fix:

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

medium

A. Replace current = newNode; with current.next = newNode;

B. Replace this.head = newNode; with this.head.next = newNode;

C. Remove the while loop entirely

D. Change if (this.head === null) to if (!this.head.next)

Solution

1. Step 1: Understand the purpose of the while loop

   The loop finds the last node where current.next is null.

2. Step 2: Identify the mistake in assignment

   Assigning current = newNode; only changes the local variable, not the list. It should link the last node's next to newNode.

3. Final Answer:

   Replace current = newNode; with current.next = newNode; -> Option A

4. Quick Check:

   Link last node's next to new node [OK]

Hint: Assign newNode to current.next, not current [OK]

Common Mistakes:

• Assigning newNode to current variable instead of current.next
• Changing head incorrectly
• Removing necessary traversal loop

5. You want to create a method remove(value) in your singly linked list that deletes the first node with the given value. Which approach correctly handles removing the head node and other nodes?

hard

A. Remove node by setting head = null if value matches, else do nothing

B. Always traverse from head and remove node by setting current = current.next without checking head separately

C. Traverse list and remove node by setting current.next = null when value matches

D. Check if head has the value, update head to head.next; else traverse and update previous.next to current.next when found

Solution

1. Step 1: Handle removal of head node

   If the head node contains the value, update head to head.next to remove it.

2. Step 2: Traverse and remove non-head nodes

   Traverse nodes keeping track of previous; when node with value found, set previous.next to current.next to unlink it.

3. Final Answer:

   Check if head has the value, update head to head.next; else traverse and update previous.next to current.next when found -> Option D

4. Quick Check:

   Remove head or unlink node by adjusting pointers [OK]

Hint: Handle head removal separately, then unlink nodes [OK]

Common Mistakes:

• Not updating head when removing first node
• Breaking links incorrectly causing list loss
• Setting current.next = null removes too much