DHC-オンライン講座
文系の人にもわかる プログラミング入門

Lesson 12   プログラムの別ファイルへの保存

次のLessonで作る「採点機能付き計算練習ページ」はかなり大きなプログラムになります。 このための準備として, もうひとつ便利な機能を学んでおきましょう。 別ファイルへのプログラム(スクリプト)の保存機能です。

別のファイルにスクリプトを保存 ── <script ... src="filename.js">

計算練習のプログラムもだいぶ長くなってきましたが, 計算問題を生成する部分はいつも同じでここのところまったく変更していません。 そこで, この部分をいつもリストするのは面倒なので, ほかのファイルに入れて参照するだけにしたいと思います。

<script>タグにsrc属性を指定し, ここにファイル名を書くことにより, JavaScriptのプログラムを, ブラウザにアドレスを指定するHTMLのファイルとは別のファイルに保存しておくことができます。

<script type="text/javascript" src="keisansub.js">
</script>

src属性への指定は<a>タグと同様で, 相対的にファイルを指定することも, URLを使って http://... と絶対的に指定することもできます。

プログラム12-1 example12-01.html 計算練習11

一方keisansub.jsの方は次のようになります。

プログラム12-2 keisansub.js 計算練習ファイル2

こちらはJavaScriptのファイルなので, keisansub.htmlのように拡張子をhtmlとする必要はありません。 keisansub.jsなどと, .jsという「拡張子」をつけてJavaScriptのファイルであることを表します。

このように別のファイルにしておくと, まちがってさわる必要のない部分を変更してしまう危険もなくなります。 また, randomInt()などkeisansub.jsに入っている関数を自分用の「ライブラリ」として, 簡単に使うことができるようにもなります。

メモ

グローバル変数の名前をgKeisanSubMondaiKiokuとgKeisanSubMondaiBangouと変更しました。 gを付けたのは, gKanjiYomiと同じ流儀にするためです。 なぜ, こんなに長くしたかは, 次のLessonで説明します。

まとめ

このLessonでは, プログラムの一部を別のファイルに保存する方法を紹介しました。

JavaScript関連のタグ

DHC-オンライン講座
文系の人にもわかる プログラミング入門
Lesson 12