JavaScript Interview Question #97

What is the difference between named exports and default exports?

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

Quick Interview Answer

A module can have multiple named exports, which are imported using their exported names unless aliases are used. A module can also have one default export, which the importing module may bind to a locally chosen name.

Detailed Explanation

A module can have multiple named exports, which are imported using their exported names unless aliases are used. A module can also have one default export, which the importing module may bind to a locally chosen name.

Named exports are useful when a module exposes several related members. Default exports are commonly used when one value represents the module's primary public value.

Code Example

// userService.js
export const getUser = () => {};
export const saveUser = () => {};

export default class UserService {}

// app.js
import UserService, {
    getUser,
    saveUser
} from "./userService.js";