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.
Javascript
interface TreeNode { value: number; left?: TreeNode; right?: TreeNode; } const rootNode: TreeNode = { value: 5, left: { value: 3, left: { value: 2 }, right: { value: 4 } }, right: { value: 8, left: { value: 7 }, right: { value: 9 } } }; console.log(rootNode); |
Output:
{
value: 5,
left: {
value: 3,
left: {
value: 2
},
right: {
value: 4
}
},
right: {
value: 8,
left: {
value: 7
},
right: {
value: 9
}
}
}
How to Create Interface with Self-Reference Property in TypeScript ?
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.
Table of Content
- Direct Reference Approach
- Using Type Aliases Approach