JavaScriptモジュールの使用方法

まず、JavaScriptモジュールを使用するためには、モジュールをエクスポートする必要があります。例えば、以下のようなモジュールを作成することができます:

// モジュールのエクスポート
export function add(a, b) {
  return a + b;
}
export function subtract(a, b) {
  return a - b;
}

次に、他のファイルでこのモジュールを使用する方法を見てみましょう。他のファイルでモジュールをインポートするには、以下のようにします:

// モジュールのインポート
import { add, subtract } from './math';
console.log(add(5, 3)); // 8
console.log(subtract(5, 3)); // 2

このように、importキーワードを使用して必要な関数をインポートし、その関数を使って処理を行うことができます。

さらに、JavaScriptモジュールでは、デフォルトエクスポートと名前付きエクスポートの2つのエクスポート形式があります。デフォルトエクスポートでは、モジュールごとに1つの値や関数をエクスポートすることができます。名前付きエクスポートでは、個々の値や関数を別々にエクスポートすることができます。

// デフォルトエクスポートの例
export default function multiply(a, b) {
  return a * b;
}
// 名前付きエクスポートの例
export const PI = 3.14159;
export const square = (x) => x * x;

他のファイルでデフォルトエクスポートを使用する場合は、以下のようにインポートします:

import multiply from './math';
console.log(multiply(5, 3)); // 15

名前付きエクスポートを使用する場合は、以下のようにインポートします:

import { PI, square } from './math';
console.log(PI); // 3.14159
console.log(square(5)); // 25

JavaScriptモジュールを使用することで、コードの再利用性を高め、プロジェクトの管理を簡素化することができます。ぜひこれらの基本的な使い方とコード例を参考にして、効率的なウェブ開発を行ってください。