Direct Reference Approach

In the Direct Reference approach, the interface directly references itself within its definition. This straightforward method allows for clear and explicit declaration of recursive data structures in TypeScript.

Syntax:

interface TreeNode {
    value: number;
    left?: TreeNode;
    right?: TreeNode;
}

Example: The below code creates an interface with self referencing property to create a TreeNode.

Output:

{
    value: 5,
    left: {
        value: 3,
        left: {
            value: 2
        },
        right: {
            value: 4
        }
    },
    right: {
        value: 8,
        left: {
            value: 7
        },
        right: {
            value: 9
        }
    }
}

In TypeScript, interfaces allow you to define the structure of objects. Sometimes, you may need to create interfaces where an object property refers to the object itself. This is useful for defining recursive data structures like trees or linked lists.