Tree Traversal Preorder Root Left Right in DSA Javascript - Build from Scratch

Tree Traversal Preorder Root Left Right

📖 Scenario: You are working with a simple family tree where each person has a name and may have children. You want to visit each person starting from the root (the oldest ancestor), then visit their children from left to right.

🎯 Goal: Build a program that creates a tree structure and prints the names of all family members using preorder traversal (root, then left child, then right child).

📋 What You'll Learn

Create a tree node structure with name, left, and right properties

Create a tree with exactly three nodes: root, left child, and right child

Write a recursive function called preorderTraversal that visits nodes in preorder

Print the names of the nodes in preorder traversal order separated by spaces

💡 Why This Matters

🌍 Real World

Tree traversal is used in many real-world applications like organizing family trees, file systems, and decision trees.

💼 Career

Understanding tree traversal is important for software developers working with hierarchical data, databases, and algorithms.

1

Create the tree nodes

Create three variables called root, leftChild, and rightChild. Each should be an object with a name property set to exactly "Grandparent", "Parent", and "Uncle" respectively. Also, set their left and right properties to null.

DSA Javascript

# Your code here

Hint

Each node is an object with name, left, and right. Start by creating these three objects with the exact names and values.

2

Link the nodes to form the tree

Set the left property of root to leftChild and the right property of root to rightChild.

DSA Javascript

const root = { name: "Grandparent", left: null, right: null };
const leftChild = { name: "Parent", left: null, right: null };
const rightChild = { name: "Uncle", left: null, right: null };

# Your code here

Hint

Assign the leftChild and rightChild objects to the left and right properties of root.

3

Write the preorder traversal function

Write a recursive function called preorderTraversal that takes a node as input. It should visit the node by adding its name to an array called result, then recursively visit the left child, then the right child. Declare result as an empty array before calling the function.

DSA Javascript

const root = { name: "Grandparent", left: null, right: null };
const leftChild = { name: "Parent", left: null, right: null };
const rightChild = { name: "Uncle", left: null, right: null };

root.left = leftChild;
root.right = rightChild;

const result = [];

# Your code here

Hint

Use a function that first adds the current node's name to result, then calls itself on the left child, then on the right child. Stop when the node is null.

4

Print the preorder traversal result

Print the contents of the result array as a single string with names separated by spaces using console.log.

DSA Javascript

const root = { name: "Grandparent", left: null, right: null };
const leftChild = { name: "Parent", left: null, right: null };
const rightChild = { name: "Uncle", left: null, right: null };

root.left = leftChild;
root.right = rightChild;

const result = [];

function preorderTraversal(node) {
    if (node === null) {
        return;
    }
    result.push(node.name);
    preorderTraversal(node.left);
    preorderTraversal(node.right);
}

preorderTraversal(root);

# Your code here

Hint

Use console.log(result.join(" ")) to print the names separated by spaces.

Practice

1. What is the order of nodes visited in a preorder tree traversal?

easy

A. Left, Right, Root

B. Left, Root, Right

C. Root, Left, Right

D. Right, Root, Left

Solution

1. Step 1: Understand preorder traversal definition

   Preorder traversal visits the root node first, then the left subtree, and finally the right subtree.

2. Step 2: Confirm the visiting order

   The visiting order is Root, then Left child, then Right child.

3. Final Answer:

   Root, Left, Right -> Option C

4. Quick Check:

   Preorder = Root, Left, Right [OK]

Hint: Remember preorder starts with the root node first [OK]

Common Mistakes:

• Confusing preorder with inorder or postorder
• Visiting left or right child before root
• Mixing up left and right subtree order

2. Which of the following is the correct JavaScript function signature for preorder traversal of a binary tree node named root?

easy

A. function preorder(root) { if(root) { preorder(root.left); preorder(root.right); console.log(root.value); } }

B. function preorder(root) { if(root) { preorder(root.left); console.log(root.value); preorder(root.right); } }

C. function preorder(root) { if(root) { preorder(root.right); preorder(root.left); console.log(root.value); } }

D. function preorder(root) { if(root) { console.log(root.value); preorder(root.left); preorder(root.right); } }

Solution

1. Step 1: Recall preorder traversal order

   Preorder visits root first, then left subtree, then right subtree.

2. Step 2: Check function steps

   function preorder(root) { if(root) { console.log(root.value); preorder(root.left); preorder(root.right); } } prints root value first, then recursively visits left and right children, matching preorder.

3. Final Answer:

   function preorder(root) { if(root) { console.log(root.value); preorder(root.left); preorder(root.right); } } -> Option D

4. Quick Check:

   Print root before children = function preorder(root) { if(root) { console.log(root.value); preorder(root.left); preorder(root.right); } } [OK]

Hint: Print root value before recursive calls for preorder [OK]

Common Mistakes:

• Printing after visiting children (postorder)
• Swapping left and right recursive calls
• Missing base case for null root

3. Given the binary tree below, what is the output of a preorder traversal?

    1
   / \
  2   3
 / \
4   5

Use the format: 1 -> 2 -> 4 -> 5 -> 3 -> null

medium

A. 1 -> 2 -> 4 -> 5 -> 3 -> null

B. 4 -> 2 -> 5 -> 1 -> 3 -> null

C. 2 -> 4 -> 5 -> 1 -> 3 -> null

D. 1 -> 3 -> 2 -> 4 -> 5 -> null

Solution

1. Step 1: Start at root node 1

   Visit root first: 1

2. Step 2: Traverse left subtree of 1

   Visit 2, then its left child 4, then right child 5

3. Step 3: Traverse right subtree of 1

   Visit 3

4. Final Answer:

   1 -> 2 -> 4 -> 5 -> 3 -> null -> Option A

5. Quick Check:

   Preorder visits root, left, right = 1 -> 2 -> 4 -> 5 -> 3 -> null [OK]

Hint: Follow root, then left subtree, then right subtree order [OK]

Common Mistakes:

• Visiting left subtree after right subtree
• Starting traversal from left child instead of root
• Confusing preorder with inorder or postorder

4. The following JavaScript code is intended to perform a preorder traversal and print node values. What is the error?

function preorder(root) {
  if (root === null) return;
  preorder(root.left);
  console.log(root.value);
  preorder(root.right);
}

medium

A. The console.log should be before the recursive calls

B. The base case should check for undefined, not null

C. The function should return a value instead of void

D. The left and right recursive calls are swapped

Solution

1. Step 1: Analyze the order of operations

   The code visits left child first, then prints root, then visits right child.

2. Step 2: Compare with preorder traversal order

   Preorder requires printing root before visiting children, so console.log should be before recursive calls.

3. Final Answer:

   The console.log should be before the recursive calls -> Option A

4. Quick Check:

   Print root first in preorder [OK]

Hint: Print root value before recursive calls in preorder [OK]

Common Mistakes:

• Printing after left subtree instead of before
• Confusing preorder with inorder traversal
• Ignoring base case for null nodes

5. You have a binary tree where some nodes have only one child. How does preorder traversal handle nodes with a missing left child?
Consider this tree:

    10
      \
      20
     /  \
   30    40

What is the preorder traversal output?

hard

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

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

C. 10 -> 20 -> 40 -> 30 -> null

D. 10 -> 30 -> 20 -> 40 -> null

Solution

1. Step 1: Visit root node 10

   Start with root: 10

2. Step 2: Check left child of 10

   Left child is missing, so skip to right child 20

3. Step 3: Visit node 20 and its children

   Visit 20, then left child 30, then right child 40

4. Final Answer:

   10 -> 20 -> 30 -> 40 -> null -> Option B

5. Quick Check:

   Preorder visits root, left (if any), right = 10 -> 20 -> 30 -> 40 -> null [OK]

Hint: Skip missing children, visit existing nodes in preorder order [OK]

Common Mistakes:

• Assuming missing left child means skip right child
• Visiting children in wrong order
• Confusing preorder with other traversals