Modul JavaScript

Modul (Modules)

Modul JavaScript memungkinkan anda memecah kod ke fail-fail yang berasingan.

Ini akan membuat pemeliharaan pustaka kod lebih mudah.

Modul adalah menggunakan import pernyataan dari fail eksternal yang diimport.

Modul masih bergantung kepada <script> tag di dalam. type="module".

实例

<script type="module">
import message from "./message.js";
</script>

亲自试一试

eksport

denganfungsiatauvariabelmodul boleh disimpan di mana saja fail eksternal.

Eksport ada dua jenis:Eksport BerNamadanEksport Laku Lai.

Eksport BerNama (Named Exports)

Berikan fail bernama person.js danisi isinya yang hendak di eksport.

Anda boleh membuat eksport berNama melalui dua cara. Satu adalah membuat secara individu secara inline, dan yang lain adalah membuat sekali di bawah dasar file.

Buat secara individu secara inline:

person.js

export const name = "Bill";
export const age = 19;

Buat sekali di bawah dasar file:

person.js

const name = "Bill";
const age = 19;
export {name, age};

Eksport Laku Lai (Default Exports)

让我们创建另一个名为 message.js 的文件，并用其演示默认导出。

一个文件中只能有一个默认导出。

实例

message.js

const message = () => {
const name = "Bill";
const age = 19;
return name + ' is ' + age + 'years old.';
};
export default message;

导入

您可以通过两种方式将模块导入到文件中，具体取决于它们是命名导出还是默认导出。

命名导出是使用大括号构造的。默认导出不是。

从命名导出中导入

从文件 person.js 导入命名导出：

import { name, age } from "./person.js";

亲自试一试

从默认导出导入

从文件 message.js 导入默认导出：

import message from "./message.js";

亲自试一试

注意

模块仅适用于 HTTP(s) 协议。

通过 file:// 协议打开的网页无法使用导入/导出。