ES Modules (ESM) are JavaScript’s official module system. Each module is a separate file with its own scope. Variables and functions are not accessible outside unless explicitly exported.

• Use named and default exports/imports
• Understand dynamic imports for lazy loading
• Know the difference between ESM and CommonJS
• Use barrel files for organized exports
• Understand module scope and strict mode

flowchart LR
    A["module-a.js"]
    B["module-b.js"]
    C["module-c.js"]
    D["main.js"]

    A -->|"export function"| D
    B -->|"export default"| D
    C -->|"export class"| D

    D -->|"import"| A
    D -->|"import"| B
    D -->|"import"| C

• Functions and scope
• Understanding of file organization
• Basic Node.js or browser environment

Named Exports → Default Exports → Dynamic Import → ESM vs CommonJS

• Each module has its own scope
• Modules are always in strict mode
• Modules are deferred by default in the browser
• import and export are static (analyzed at compile time)
• Dynamic imports use import() (returns a Promise)

• Execution Context
• Promises