🔰module

JS ⟩ module

Modules provide structure to bigger programs by separating the code into pieces with clear interfaces and dependencies.

• interface： the part that’s visible from other modules.

• dependencies： other modules that it makes use of.

⭐️ 重點

in Node.js, each JS file is treated as a module.

in a module there's no "module scope object" for these top-level declarations to be added to as property.

( 👉 compare： global var / function is global object property❗️)

A "variable" is just a property of the environment record (associated with the currently executing block /function /module /script).

The relations between modules are called dependencies. When a module needs a piece from another module, it is said to depend on that module.

🔴 主題

• main features of modules

  • import / export

• other features of modules

  • import.meta

  • browser-specific features

  • module scope

• types of modules

  • ES module / CommonJS

• other related topics

  • package

  • module pattern - used before introduction of native ES module.

  • replit.comimport .js file

📗 參考

• JS.info ⟩ Modules

• Eloquent JS ⟩ Module

  • Circular Dependencies

• DEV ⟩ Getting Started with JavaScript Modules

• MakeUseOf ⟩ An Introduction to Module Systems in JavaScript

• YDKJS: Scope & Closures (v.2) > Chapter 8: The Module Pattern

👥 相關

• module scope

🐞 除錯

• VSCode ⟩

  • can not use import statement outside a module (YouTube) rename file extension to .mjs

  • Unexpected token on "export default const"

    // ⛔ SyntaxError: 
    export default const a = { ... }
    //             ^^^^^  <---- Unexpected token 'const'
    
    // ✅ syntax is OK now!
    const a = { ... };
    export default a;