TypeScript Modules and Namespaces Examples

Understanding TypeScript Modules and Namespaces

TypeScript, being a superset of JavaScript, provides powerful features for organizing code through modules and namespaces. These constructs help in structuring applications, enhancing maintainability, and avoiding naming conflicts. Below are three practical examples of TypeScript modules and namespaces that illustrate their usage in real-world scenarios.

Example 1: Basic Module for User Management

Context

In this example, we will create a simple user management module that includes functionality for adding and retrieving users. This is particularly useful for applications that require user authentication and management.

// userManagement.ts

export interface User {
    id: number;
    name: string;
    email: string;
}

const users: User[] = [];

export function addUser(user: User): void {
    users.push(user);
}

export function getUser(id: number): User | undefined {
    return users.find(user => user.id === id);
}

Notes

• The User interface defines the structure of a user object.
• The addUser function allows adding a new user to the array, while getUser retrieves a user based on their ID.

Example 2: Using Namespaces for Mathematical Operations

Context

This example demonstrates how to use namespaces to encapsulate related mathematical operations. This approach prevents naming conflicts and makes the code easier to manage, especially in larger applications.

namespace MathOperations {
    export function add(a: number, b: number): number {
        return a + b;
    }

    export function subtract(a: number, b: number): number {
        return a - b;
    }

    export function multiply(a: number, b: number): number {
        return a * b;
    }

    export function divide(a: number, b: number): number {
        if (b === 0) throw new Error('Cannot divide by zero');
        return a / b;
    }
}

// Usage
const sum = MathOperations.add(5, 3);
const product = MathOperations.multiply(4, 2);

Notes

• Each function within the MathOperations namespace performs a basic arithmetic operation.
• The use of export allows these functions to be accessed outside the namespace.

Example 3: Combining Modules and Namespaces for a Shopping Cart

Context

In this example, we will create a shopping cart module that utilizes both modules and namespaces. This is ideal for e-commerce applications where you need to manage products and handle cart operations efficiently.

// shoppingCart.ts

export interface Product {
    id: number;
    name: string;
    price: number;
}

namespace ShoppingCart {
    const cart: Product[] = [];

    export function addToCart(product: Product): void {
        cart.push(product);
    }

    export function getCartItems(): Product[] {
        return cart;
    }

    export function calculateTotal(): number {
        return cart.reduce((total, product) => total + product.price, 0);
    }
}

// Usage
const newProduct: Product = { id: 1, name: 'Laptop', price: 999.99 };
ShoppingCart.addToCart(newProduct);
const total = ShoppingCart.calculateTotal();

Notes

• The Product interface describes the structure of a product object.
• The ShoppingCart namespace includes functions to manage cart items and calculate the total price.

These examples of TypeScript modules and namespaces showcase how to effectively structure your code, making it more maintainable and organized. Whether you are creating a user management system, performing mathematical operations, or managing a shopping cart, understanding and utilizing these constructs can significantly enhance your development process.