Modules and Namespaces

Modules and Namespaces

22 Dec 2023
Advanced
22K Views
2 min read
Learn via Video Course & by Doing Hands-on Labs

TypeScript Programming Course

Modules and Namespaces in Typescript: An Overview

Modules and Namespaces are strong TypeScript features for organizing and structuring your code. They help in the prevention of naming collisions, the improvement of code readability, and the promotion of code reusability. However, their approaches and applications differ. When diving into a TypeScript tutorial on modules and namespaces, understanding their distinctions becomes crucial for efficient code management and development.

Modules in Typescript

  • A module is an approach to define a collection of linked variables, functions, classes, interfaces, and so on.
  • It runs in the local scope rather than the global scope.
  • In other words, variables, functions, classes, and interfaces declared in a module cannot be directly accessed outside of the module.
  • We can use the export keyword to construct a module that we can then utilize in other modules by using the import keyword.

Example of Modules in Typescript

// math.ts

export function add(a: number, b: number): number {

return a + b;

}

// app.ts

import { add } from "./math";

const result = add(5, 7); // result will be 12

console.log(result);

math.ts defines a module containing an add function that is exported to other modules. App.ts imports and uses the add function from math.ts, showing modularity and code reuse.

Namespaces in Typescript

Namespaces organize code within modules or across several files by grouping related declarations (functions, classes, etc.) under a unique identifier.

Example of Namespaces in Typescript

namespace MathUtils {

export function add(a: number, b: number): number {

return a + b;

}

export function factorial(n: number): number {

let result = 1;

for (let i = 1; i <= n; i++) {

result *= i;

}

return result;

}

}

console.log(MathUtils.add(5, 7)); // 12

console.log(MathUtils.factorial(5)); // 120

The MathUtils namespace contains functions that are related, preventing global name conflicts with other Math functions. The functions add and factorial is exported for external use while remaining organized within the namespace.
Summary
TypeScript modules and namespaces provide organization and structure. Modules contain code, whereas namespaces contain associated declarations. Both eliminate clashes and improve readability, but modules provide modularity and reusability, whereas namespaces organize within or across modules or files.

FAQs

Q1. What are TypeScript namespaces?

A namespace in TypeScript is a method of organizing code into logical categories and avoiding naming clashes between identifiers.

Q2. What are modules in TypeScript?

Any file containing a top-level import or export is considered a module in TypeScript, just as it is in ECMAScript 2015. A file with no top-level import or export declarations, on the other hand, is viewed as a script whose contents are available in the global scope (and hence to modules as well).

Q3. What are TypeScript modules?

Any file containing a top-level import or export is considered a module in TypeScript, just as it is in ECMAScript 2015. A file with no top-level import or export declarations, on the other hand, is viewed as a script whose contents are available in the global scope (and hence to modules as well).

Q4. Why use modules in TypeScript?

TypeScript provides modules and namespaces to prevent the code's default global scope and to organize and maintain a vast code base. Modules allow you to define a local scope in the file. As a result, all variables, classes, methods, and so on declared in a module are inaccessible outside of the module.

Take our free typescript skill challenge to evaluate your skill

In less than 5 minutes, with our skill challenge, you can identify your knowledge gaps and strengths in a given skill.

GET CHALLENGE

Share Article
About Author
Shailendra Chauhan (Microsoft MVP, Founder & CEO at Scholarhat by DotNetTricks)

Shailendra Chauhan is the Founder and CEO at ScholarHat by DotNetTricks which is a brand when it comes to e-Learning. He provides training and consultation over an array of technologies like Cloud, .NET, Angular, React, Node, Microservices, Containers and Mobile Apps development. He has been awarded Microsoft MVP 8th time in a row (2016-2023). He has changed many lives with his writings and unique training programs. He has a number of most sought-after books to his name which has helped job aspirants in cracking tough interviews with ease.
Accept cookies & close this