[構文] ブラウザでES Modules機能を有効化する。
・ HTMLファイル内に記述するとき
<script type="module">
    /* ES Modulesが有効化されています。 */
<script>

・ JavaScriptファイルを読み込む場合
<script type="module" src="JavaScriptファイルまでのパス">

・ 名前付きエクスポートの記法

// 変数のエクスポート
export let variable = "変数宣言の前にexportキーワードを付けます";
export const constant = "定数もエクスポート可能です。";

// 複数の変数を一括でエクスポート
export let val1 = "値1", val2 = "値2";

// 関数、ジェネレータ、クラスのエクスポート
export function exportedFunction() { };
export function* exportedGenerator() { };
export class ExportedClass { }

// モジュール内で定義した変数、関数、クラスの一括エクスポート
let normalVarialbe = "モジュール内で宣言した変数";

function normalFunction() { }
class NormalClass { }

export { normalVariable, normalFunction, NormalClass };

// 別名を指定してエクスポート(as で別名を付ける)
export {
    normalVariable as publicVariable,
    normalFunction as publicFunction,
    NormalClass as PublicClass,
};

// 分割代入しながらエクスポート(オブジェクトから分割代入でエクスポート)
const normalObject = {
    normalVal: normalVariable,
    normalFn: normalFunction,
    NormalCls: NormalClass
}
export const { normalVal, normalFn, NormalCls } = normalObject;

・ デフォルトエクスポートの記法

// 無名関数をデフォルトエクスポート
export default function() { }

// アロー関数をデフォルトエクスポート
export default () => { }

// 名前をつけても import の際には任意の名前で使うことが可能
export default function exportedFunction() { }

// クラスのエクスポート
export default class { }

// 名前を付けても import の際には任意の名前で使うことが可能
export default class ExportedClass { }

// defaultという名前を付けるとデフォルトエクスポートとしてエクスポートされる。
function normalFunction() { }
export { normalFunction as default };

・ モジュール集約の記法
// デフォルトエクスポートを含むすべての機能をエクスポート
export * from "./sub.module.js";

// デフォルトエクスポートを含むすべての機能をsubObject オブジェクトのプロパティとしてエクスポート
export * as subObject from "./sub.module.js";

// 特定の機能だけエクスポート
export { subVariable, subFunction, SubClass } from "./sub.module.js";

// 別名をつけてエクスポート
export {
    subVariable as exportedVariable,
    subFunction as exportedFunction,
    SubClass as ExportedClass,
} from "./sub.module.js";

// デフォルトエクスポート
export { default } from "./sub.module.js";

・ インポート・静的インポート

// 名前つきエクスポートをインポート
import { exportedVariable, exportedFunction, ExportedClass } from "/path/to/module.js";

// 別名を付けてインポート
import { exportedName as importedName } from "/path/to/module.js";

// デフォルトエクスポートと名前付きエクスポートをオブジェクト(moduleObject)のプロパティとしてインポート
// デフォルトエクスポートはdefaultプロパティに格納される。
import * as moduleObject from "/path/to/module.js";

// デフォルトエクスポート(defaultExport)を読み込む
import defaultExport from "/path/to/module.js";

// デフォルトエクスポート(defaultExport)と名前付きエクスポート(namedExport1, namedExport2)をそれぞれインポート
import defaultExport, { namedExport1, namedExport2 } from "/paath/to/module.js";

// デフォルトエクスポート(defaultExport)と名前付きエクスポートをオブジェクト(moduleObject)のプロパティとしてそれぞれインポート
import defaultExport, * as moduleObject from "/path/to/module.js";

// インポートなしにモジュール(module.js)内のコードを一度だけ実行
import "/path/to/module.js";

[構文]importの記法

const moduleProm = import("/path/to/module.js");

moduleProm: 対象のファイルでエクスポートされた関数や変数を保持するオブジェクト(モジュールオブジェクト)が
Promiseでラップされたものが渡される。

・ モジュールの動的インポート

<script>

    // Promiseオブジェクトでラップされたモジュールが渡される。 
    let promise = import("./module.js");
    promise.then(moduleObject => {
        moduleObject.exportredFn();
        > exportedFnが呼ばれました。
    });

    // await/asyncを使用することも可能
    async function asyncFunction() {
        let { exportedFn } = await import("./module.js");
        exportedFn();
        > exportedFnが呼ばれました。
    }

    asyncFunction();
</script>

(module.js)
export function exportedFunction() {
    console.log("exportedFnが呼ばれました。");
}

[構文] Strictモードの有効化
・ ファイルの先頭
"use strict";

・ 関数の先頭
function strictFunction() {
    "use strict"; // 関数の先頭
}

・ ES Moduleが有効なとき
<script type="module">
    /* Strictモードは有効です。 */
</script>

[構文] Common.jsを使ったエクスポート

・ exportsに追加
exports exportedFunction = function() {
    /** 関数をエクスポート */
}

・ module.exportsに追加
module.exports.exportedVariable = "これはエクスポートされます。";

[構文] CommonJSを使ったインポート

const moduleObject = require("/path/to/module.js");

moduleObject: 読み込んだファイル(module.js)のmodule.exportsが保持するオブジェクトが渡される。

(export-module.js)
module.exports.exportedFunction = function() {
    console.log("機能の読み込み確認");
};

(import-module.js)
const moduleObject = require("./export-module.js");
moduleObject.exportedFunction();