JavaScript Interview Question #98

What is dynamic import()?

Promises, Async/Await, Fetch & Modern JavaScript Mid-Level Intermediate

Quick Interview Answer

Dynamic import() loads a module asynchronously and returns a Promise for the module namespace object. Unlike a static import declaration, it can be invoked conditionally at runtime.

Detailed Explanation

Dynamic import() loads a module asynchronously and returns a Promise for the module namespace object. Unlike a static import declaration, it can be invoked conditionally at runtime.

It is commonly used for code splitting, feature-based loading, or loading expensive functionality only when it is required.

Code Example

async function openReport() {
    const module = await import("./report.js");

    module.showReport();
}

document
    .querySelector("#reportButton")
    .addEventListener("click", openReport);