Difference Between Internal & External Modules in TypeScript

In TypeScript, modules are a way to organize code and encapsulate functionality. There are two types of modules: internal modules (also known as namespaces) and external modules (also known as modules).

Internal Modules (Namespaces):

Internal modules, known as namespaces, provide a way to organize code within a single global scope. They help in avoiding naming conflicts by encapsulating code within a named container.

Syntax:

namespace MyNamespace {
    // code within the namespace
}

Example: Here, a namespace named MathOperations is created to group mathematical functions like addition and subtraction. The functions are then accessed within the namespace, showcasing the encapsulation provided by internal modules.

Javascript

namespace MathOperations {
    export function add(x: number, y: number): number {
        return x + y;
    }

    export function subtract(x: number, y: number): number {
        return x - y;
    }
}

// Usage
let resultAdd = MathOperations.add(5, 3);
let resultSubtract = MathOperations.subtract(8, 2);

console.log(resultAdd);      // Output: 8
console.log(resultSubtract); // Output: 6

Output:

8
6

External Modules

External modules allow you to organize code into separate files. Each file is treated as a separate module, and you can explicitly export and import functionalities between these modules. It is also known as the ES6 module.

Syntax: File 1 (moduleA.ts):

// moduleA.ts
export const variableA = 10;
export function functionA(): void {
    // code
}

File 2 (moduleB.ts):

// moduleB.ts
import { variableA, functionA } from './moduleA';
// code using variableA and functionA

Example: Here, moduleA.ts defines a namespace MathOperations, and moduleB.ts imports and uses the functionalities from moduleA.

Javascript

// moduleA.ts
export namespace MathOperations {
    export function add(x: number, y: number): number {
        return x + y;
    }

    export function subtract(x: number, y: number): number {
        return x - y;
    }
}

Javascript

// moduleB.ts
import { MathOperations } from './moduleA';

// Usage
let resultAdd = MathOperations.add(5, 3);
let resultSubtract = MathOperations.subtract(8, 2);

console.log(resultAdd);      // Output: 8
console.log(resultSubtract); // Output: 6

Output:

8
6