What is namespace in Typescript ?
Last Updated :
17 Mar, 2025
In TypeScript, a namespace is a way to organize code logically and prevent naming conflicts between identifiers. It allows developers to group related functionalities, such as interfaces, classes, functions, and variables, within a dedicated scope.
Namespaces are particularly useful for structuring large applications, avoiding global scope pollution, and maintaining a clear hierarchy.
Declaring and Using a Namespace in TypeScript
Here’s a simple example demonstrating how to create and use a namespace in TypeScript:
JavaScript
namespace Geometry {
export class Circle {
constructor(public radius: number) {}
area(): number {
return Math.PI * this.radius ** 2;
}
}
}
const circle = new Geometry.Circle(5);
console.log(circle.area());
- Namespace Declaration: The Geometry namespace encapsulates the Circle class, ensuring that its members are scoped within this namespace.
- Class Definition: The Circle class has a constructor to set the radius and a method area() to calculate the area of the circle.
- Object Instantiation: An instance of Circle is created with a radius of 5.
- Method Invocation: The area() method is called on the circle instance to compute and log the area.
Output:
78.53981633974483
More Examples of Namespace in TypeScript
Declaring and Accessing a Simple Namespace
JavaScript
namespace MyNamespace {
export function myFunction() {
console.log('This is my function in MyNamespace');
}
}
MyNamespace.myFunction();
- Namespace Declaration: MyNamespace is defined using the namespace keyword, encapsulating the myFunction function.
- Function Definition: myFunction logs a message to the console.
- Export Keyword: The export keyword makes myFunction accessible outside the MyNamespace namespace.
- Function Invocation: myFunction is called using dot notation: MyNamespace.myFunction().
Output:
This is my function in MyNamespac
Declaring and Accessing a Nested Namespace
JavaScript
namespace MyNamespace {
export namespace MySubNamespace {
export function myFunction() {
console.log('This is my function in MySubNamespace');
}
}
}
MyNamespace.MySubNamespace.myFunction();
- Nested Namespace Declaration: MySubNamespace is defined inside MyNamespace, creating a hierarchical structure.
- Function Definition: myFunction logs a message to the console.
- Export Keyword: The export keyword makes myFunction accessible outside the MySubNamespace namespace.
- Function Invocation: myFunction is called using dot notation: MyNamespace.MySubNamespace.myFunction().
Output:
"This is my function in MySubNamespace"
Benefits of Using Namespaces
- Organize Code: Namespaces help group related code together, making it easier to manage and maintain.
- Prevent Conflicts: They avoid naming issues by keeping your code in its own unique space.
- Hide Details: You can keep internal code hidden and only show the necessary parts to the outside world.
- Break Down Code: Namespaces let you divide a large project into smaller, easier-to-manage pieces.
Namespaces vs. Modules in TypeScript
Here are the main differences between Namespaces and Modules in TypeScript:
Feature | Namespaces | Modules |
---|
Usage | TypeScript-specific | Standard JavaScript feature |
Scope | Works within a global file | Works across multiple files |
Syntax | Uses namespace keyword | Uses import /export |
Modularity | Less flexible | More scalable and reusable |
Recommendation | Not preferred for new projects | Recommended for modern development |