JavaScript モジュールは、JavaScript コードを整理して再利用する方法です。モジュールを使用すると、コードをより小さく管理しやすい部分に分割でき、必要に応じてアプリケーションの他の部分にインポートして使用できます。このモジュール式のアプローチは、クリーンなコードベースの維持に役立ち、デバッグが容易になり、コードの再利用性が向上します。
JavaScript エコシステムにはさまざまなモジュール システムがあります。 ES モジュール (ESM) は ECMAScript 仕様の標準であり、主にブラウザで使用され、Node.js でのサポートが増えています。 CommonJS は、Node.js で伝統的に使用されていたもう 1 つのモジュール システムです
ES モジュール (ESM) は、ECMAScript 2015 (ES6) で導入された JavaScript の標準化されたモジュール システムです。異なるファイル間で関数、オブジェクト、プリミティブのインポートとエクスポートを可能にすることで、コードの編成と再利用性が向上します。このモジュール システムは、ブラウザーや Node.js などの最新の JavaScript 環境で広くサポートされています。
エクスポートとインポート
export キーワードは、現在のモジュールの外部からアクセスできる必要がある変数と関数にラベルを付け、アプリケーションの他の部分で再利用できるようにします。 import キーワードを使用すると、これらの機能を他のモジュールからインポートできるため、モジュール式プログラミングとコードの再利用が可能になります。名前付きエクスポートを使用すると、モジュールから複数のアイテムをエクスポートできます。各項目は、エクスポートされたときと同じ名前でインポートする必要があります。
リーリー
リーリー
リーリー
リーリー
HTML でのモジュールの使用
ブラウザでモジュールを使用する場合は、モジュールを HTML ファイルに含める必要があります。