Create a fixed seven-node binary tree and render its shape.

Algorithm

The canonical tree is 4(2(1,3),6(5,7)), so this JavaScript DSA implementation can be compared directly with the rest of the DSA track.

node links A node stores one value plus references to its left and right children.

Basic Implementation

basic.js
Replay: real traced execution (multi-file project)
class Node {
  constructor(value, left = null, right = null) {
    this.value = value;
    this.left = left;
    this.right = right;
  }
}
function render(node) {
  if (node === null) return "_";
  if (node.left === null && node.right === null) return String(node.value);
  return `${node.value}(${render(node.left)},${render(node.right)})`;
}
function sampleTree() {
  return new Node(4, new Node(2, new Node(1), new Node(3)), new Node(6, new Node(5), new Node(7)));
}

const root = sampleTree();
console.log(render(root));
  1. node ← 1, tree ← 1

    13function sampleTree() {14  return new Node(4, new Node(2, new Node(1), new Node(3)), new Node(6, new Node(5), new Node(7)));15}
    values this step1node1tree
  2. node ← 3, tree ← 1, 3

    13function sampleTree() {14  return new Node(4, new Node(2, new Node(1), new Node(3)), new Node(6, new Node(5), new Node(7)));15}
    values this step3node1, 3tree
  3. node ← 2, tree ← 2(1,3)

    13function sampleTree() {14  return new Node(4, new Node(2, new Node(1), new Node(3)), new Node(6, new Node(5), new Node(7)));15}
    values this step2node2(1,3)tree
  4. node ← 5, tree ← 2(1,3), 5

    13function sampleTree() {14  return new Node(4, new Node(2, new Node(1), new Node(3)), new Node(6, new Node(5), new Node(7)));15}
    values this step5node2(1,3), 5tree
  5. node ← 7, tree ← 2(1,3), 5, 7

    13function sampleTree() {14  return new Node(4, new Node(2, new Node(1), new Node(3)), new Node(6, new Node(5), new Node(7)));15}
    values this step7node2(1,3), 5, 7tree
  6. node ← 6, tree ← 2(1,3), 6(5,7)

    13function sampleTree() {14  return new Node(4, new Node(2, new Node(1), new Node(3)), new Node(6, new Node(5), new Node(7)));15}
    values this step6node2(1,3), 6(5,7)tree
  7. node ← 4, tree ← 4(2(1,3),6(5,7))

    13function sampleTree() {14  return new Node(4, new Node(2, new Node(1), new Node(3)), new Node(6, new Node(5), new Node(7)));15}
    values this step4node4(2(1,3),6(5,7))tree
  8. stdout ← 4(2(1,3),6(5,7))

    1class Node {2  constructor(value, left = null, right = null) {
    values this step4(2(1,3),6(5,7))stdout4(2(1,3),6(5,7))tree

Complexity

  • Time: O(n)
  • Space: O(n)

Implementation notes

  • Each tree entry is a JavaScript Node object with value, left, and right properties. The constructor defaults left and right to null, so leaf nodes like new Node(1) and new Node(3) have explicit missing child references.
  • sampleTree() wires object references directly with nested constructor calls: 2 receives nodes 1 and 3, 6 receives nodes 5 and 7, and root 4 receives those two subtree objects.
  • The replay shows construction bottom-up: create 1, create 3, create 2(1,3), create 5, create 7, create 6(5,7), then create the root 4(2(1,3),6(5,7)).
  • render(node) recursively follows references, returns _ for null, and returns just String(node.value) for leaves. Internal nodes are formatted as ${value}(${left},${right}).
  • console.log(render(root)) prints 4(2(1,3),6(5,7)). The material heap allocation is the seven Node objects plus short strings created while rendering, all managed by the JavaScript runtime GC.