JavaScriptのtypeとは？

JavaScriptのタイプとは？

JavaScriptは、ウェブページにインタラクティブ性と動的な機能を追加するために広く使用されているスクリプト言語です。JavaScriptコードをHTMLに埋め込むには、<script>要素を使用します。この要素には、コードのタイプを指定する"type"属性があります。

type属性

<script>要素のtype属性は、スクリプトのタイプをブラウザに伝えます。この属性は、ブラウザがスクリプトを正しく解釈し実行するために重要です。type属性には、以下の値を指定できます。

値	説明
`text/javascript`	JavaScriptコードを表します。これは歴史的な理由でデフォルト値ですが、現在は省略するのが一般的です。
`module`	ECMAScriptモジュールを表します。モジュールは、他のスクリプトからインポートしたり、エクスポートしたりできる再利用可能なコードブロックです。
`importmap`	JavaScriptモジュールのインポートマップを表します。インポートマップは、モジュールの識別子をURLにマップするために使用されます。
`text/plain`	スクリプトをプレーンテキストとして扱います。スクリプトは実行されません。

<script type="text/javascript">
  // JavaScriptコード
  console.log("Hello, world!");
</script>

<script type="module">
  // モジュールコード
  import { message } from './module.js';
  console.log(message);
</script>

<script type="importmap">
  {
    "imports": {
      "module-name": "/path/to/module.js"
    }
  }
</script>

A1. type属性を省略した場合、ブラウザはスクリプトをJavaScriptコードとして解釈します。ただし、最新のHTMLでは、type属性を省略するのが一般的です。

A2. ECMAScriptモジュールは、他のスクリプトからインポートしたり、エクスポートしたりできる再利用可能なコードブロックです。モジュールを使用すると、コードを整理し、再利用性を高めることができます。

A3. インポートマップは、モジュールの識別子をURLにマップするために使用されます。モジュールをCDNから読み込む場合や、モジュールのパスを変更したい場合などに使用します。