JavaScript question detail
What is module scope in JavaScript?
Module scope is a feature introduced with ES6 (ES2015) modules that creates a scope specific to a module file, isolating variables and functions declared within it from the global scope and other modules. Variables and functions declared in a module are private by default and can only be accessed by other modules if they are explicitly exported.
Key characteristics of module scope:
- Variables declared in a module are scoped to that module only.
- Each module has its own top-level scope
- Variables and functions need to be explicitly exported to be used in other modules
- The global scope cannot access module variables unless they are explicitly exported and imported
- Modules are always executed in strict mode
// moduleA.js
// This variable is PRIVATE to moduleA. It's like a tool inside a closed box.
const privateVariable = "I am private";
// This variable is PUBLIC because it's exported. Others can use it when they import moduleA.
export const publicVariable = "I am public";
// PUBLIC function because it's exported. But it can still access privateVariable inside moduleA.
export function publicFunction() {
console.log(privateVariable); // ✅ This works because we're inside the same module.
return "Hello from publicFunction!";
}
// moduleB.js
// Importing PUBLIC items from moduleA.
import { publicVariable, publicFunction } from "./moduleA.js";
console.log(publicVariable); // ✅ "I am public" - Works because it's exported.
console.log(publicFunction()); // ✅ "Hello from publicFunction!" - Works as well.
// ❌ This will cause an ERROR because privateVariable was NOT exported from moduleA.
// console.log(privateVariable); // ❌ ReferenceError: privateVariable is not defined
Common use cases and benefits:
- Encapsulation of module-specific code
- Prevention of global scope pollution
- Better code organization and maintenance
- Explicit dependency management
- Protection of private implementation details