JavaScript模块是独立可复用的代码单元，通过export/import实现封装与通信；ES6模块为现代标准，支持命名导出、默认导出及动态导入；CommonJS仅适用于旧版Node.js环境。
JavaScript模块是一段独立的、可复用的代码单元，它封装变量、函数或类，并能明确声明哪些内容对外可用（导出）、哪些仅内部使用（私有）。模块之间通过导入导出机制通信，避免全局污染，提升代码组织性和维护性。
模块的基本形式：ES6 模块（推荐）
现代 JavaScript 使用 export 和 import 语法，需在 HTML 中以 type="module" 加载，或在打包工具（如 Vite、Webpack）中默认启用。
导出方式：
• 命名导出（可多个）：export const name = "Alice"; export function greet() { ... }
• 默认导出（每个模块最多一个）：export default function() { ... } 或 export default class User { ... }导入方式：
• 导入命名导出：import { name, greet } from './utils.js';
• 导入默认导出：import myFunc from './main.js';（无需大括号）
• 混合导入：import myDefault, { name, greet } from './module.js';
• 全部导入（不常用）：import * as utils from './utils.js'; → 用 utils.name 访问
CommonJS 模块（Node.js 早期常用）
在 Node.js 环境（尤其是未启用 ES 模块时）使用 require() 和 module.exports。语法不同，不能直接在浏览器原生脚本中运行（除非打包）。
导出：module.exports = { name: "Bob", sayHi() { ... } }; 或 exports.sayHi = function() { ... };导入：const utils = require('./utils.js');（返回整个 module.exports 对象）注意：exports 是 module.exports 的引用，直接赋值 exports = {...} 会断开连接，应始终用 module.exports 赋值
模块路径与文件后缀
导入语句中的路径必须明确：
立即学习“Java免费学习笔记（深入）”；
相对路径需带前缀：./utils.js 或 ../lib/helper.js（.js 后缀在 ES 模块中通常不可省略）不能省略 ./ 或 ../，否则会被当作内置模块或包名（如 import fs from 'fs'）Node.js 14+ 支持 "type": "module" 字段，让 .js 文件按 ES 模块解析；否则默认为 CommonJS
动态导入：按需加载模块
import() 是一个返回 Promise 的函数，用于条件加载、路由懒加载等场景：
if (needMath) { const math = await import('./math.js'); math.add(2, 3); }支持在任何位置使用（包括函数内、条件分支），不局限于顶层常用于优化首屏加载，比如只在用户点击按钮后才加载图表模块
基本上就这些。ES6 的 import/export 是当前标准，CommonJS 主要在老 Node 项目或特定工具链中出现。选哪种取决于环境和构建配置，但新项目建议统一用 ES 模块写法。
以上就是什么是JavaScript模块以及如何导出导入？的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1543737.html
微信扫一扫 
支付宝扫一扫 
