JavaScript Module 模块
模块
JavaScript 模块允许您将代码拆分成多个单独的文件。
这使得代码库的维护更加容易。
模块可以通过 import 语句从外部文件导入。
模块还依赖于<script> 标签中的 type="module"。
Export 导出
包含函数或变量的模块可以存储在任何外部文件中。
导出有两种类型:命名导出和默认导出。
命名导出
让我们创建一个名为 person.js 的文件,并在其中添加我们想要导出的内容。
您可以通过两种方式创建命名导出:逐个内联添加,或在底部一次性添加所有命名导出。
单独内联:
person.js
export const name = "Jesse";
export const age = 40;所有内容同时显示在底部:
person.js
const name = "Jesse";
const age = 40;
export {name, age};默认导出
让我们创建另一个名为 message.js 的文件,并用它来演示默认导出。
一个文件中只能有一个默认导出。
示例
message.js
const message = () => {
const name = "Jesse";
const age = 40;
return name + ' is ' + age + 'years old.';
};
export default message;Import 导入
你可以通过两种方式将模块导入文件,具体取决于它们是命名导出还是默认导出。
命名导出使用花括号构建。默认导出则不使用花括号。
注意
模块仅支持 HTTP(s) 协议。
通过 file:// 协议打开的网页无法使用导入/导出功能。
