Files

camperbot 5c868af2b8 chore(i18n,learn): processed translations (#44851 )

2022-01-20 20:30:18 +01:00

2.4 KiB

Raw Permalink Blame History

id, title, challengeType, forumTopicId, dashedName

id	title	challengeType	forumTopicId	dashedName
5cddbfd622f1a59093ec611d	モジュールスクリプトを作成する	6	301198	create-a-module-script

--description--

JavaScript は、当初の用途はほとんどが HTML ウェブであり、それ以外の用途にはあまり役に立ちませんでした。現在ではその役割は非常に大きく、ウェブサイト全体がほとんど JavaScript で構築されることもあります。 JavaScript のモジュール化を進め、コードをより明解にしてメンテナンスできるように、ES6 では JavaScript ファイル間でコードを簡単に共有する方法が導入されました。そのためには、他の 1 つまたは複数のファイルで使用できるように、ファイルの一部分をエクスポートし、必要になったときに対象の部分をインポートする必要があります。この機能を利用するには、type が module のスクリプトを HTML ドキュメントに作成する必要があります。例を次に示します。

<script type="module" src="filename.js"></script>

これで、この module タイプを使用するスクリプトで import と export の機能を使用できるようになりました。これらについてはこのあとのチャレンジで説明します。

--instructions--

type が module のスクリプトを HTML ドキュメントに追加し、index.js というソースファイルを指定してください。

--hints--

script タグを作成する必要があります。

assert(code.match(/<\s*script[^>]*>\s*<\/\s*script\s*>/g));

script タグに、module という値を設定した type 属性を持たせる必要があります。

assert(
  code.match(
    /<\s*script\s+[^t]*type\s*=\s*('|")module\1[^>]*>\s*<\/\s*script\s*>/g
  )
);

script タグに、index.js という src 属性を付ける必要があります。

assert(
  code.match(
    /<\s*script\s+[^s]*src\s*=\s*('|")index\.js\1[^>]*>\s*<\/\s*script\s*>/g
  )
);

--seed--

--seed-contents--

<html>
  <body>
    <!-- Only change code below this line -->

    <!-- Only change code above this line -->
  </body>
</html>

--solutions--

<html>
  <body>
    <script type="module" src="index.js"></script>
  </body>
</html>

2.4 KiB Raw Permalink Blame History