JavaScript 模块
模块
JavaScript 模块允许您将代码分解为单独的文件。
这使得维护代码库变得更容易。
模块使用 import
语句从外部文件导入。
模块也依赖于 <script> 标签中的 type="module"
。
导出
包含函数或变量的模块可以存储在任何外部文件中。
有两种类型的导出:命名导出和默认导出。
命名导出
让我们创建一个名为 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;
导入
您可以根据模块是命名导出还是默认导出,以两种方式将模块导入文件。
命名导出使用花括号构造。默认导出则不使用。
注意
模块仅适用于 HTTP(s) 协议。
通过 file:// 协议打开的网页不能使用 import / export。