ちょっとしたゲームセンターゲーム制作講座

ゲーム制作講座

制作講座目次 / PREV（プログラムはどこに書くの？） / NEXT（イベントハンドラを使いこなせ） / トップページ / text mode

5.JavaScriptの基礎知識

※JavaやC言語をひととおり知っている方は、読み飛ばしても結構です。

★命令と関数（続き）

JavaScriptに限らず、ほとんどのプログラムでは命令を集めて関数にしています。関数を使うと、何度も同じ命令を実行するときに便利です。関数は

<html><head>
<script language="JavaScript">

function clickhere(){
alert("クリックしたな～");
}

</script></head>
<body></body></html>

と書いて定義します。「clickhere」がその関数の名前です。好きな名前を付けて構いません（ただし、「alert」など、システムが使っている関数は使えません。また、関数名に「start」と付けるとIEでエラーになるのでやめましょう）。

関数はそのままでは動きません。その関数をどこで動かすかを記述する必要があります。

<html><head>
<script language="JavaScript">

function clickhere(){
alert("クリックしたな～");
}

</script></head>
<body>
<a href="JavaScript:clickhere();">ここをクリック</a>
</body></html>

「ここをクリック」と書いてあるところをクリックすると、関数「clickhere」が実行されます。「clickhere」が実行されると、「clickhere」の中身が実行されます。

★変数

中学校で一次方程式を習いますよね？例えば、ｙ＝２ｘ＋４とか。そして、このときのx,yを変数と呼びましたね。プログラムの場合も変数というものがあります。変数の中には数値、又は文字列が入ります。変数を使うときは、「xは変数ですよ」というように、使う前に変数の宣言をしなくてはいけません。変数の宣言は、

var x; //普通の宣言
var x=5; //xは初期値5の数値
var x="大阪"; //xは初期値「大阪」の文字列^*1

などのように書きます。変数の名前は好きに付けて構いませんが、関数同様、システムが使っているものは使えません。また、変数名に限らず、JavaScript全般にいえますが、大文字小文字（xとX）を区別するので注意してください、

*1 //はコメント。プログラムには影響しません。また、文字列を宣言するときは "" を使います。注意してください。

★代入

変数はプログラム中に何度もその値（中身）が変わっていきます。中身を変えるときに行うのが「代入」です。通常、代入は、

変数＝値;

という書き方で表現します。変数の宣言の時とほぼ同じですね。例えば、

var x=5;
x=6;

と書くと、変数xの中身は最初は5でしたが、次の文で6に変わったことになります。また、代入は次のように書くことも可能です。

var x=5;
x=x+1;

この場合、最初5だった変数xに、次の文で1を加える作業をしています。結果、xの中身は6になります。この書き方はプログラムでよく使うので、覚えておいてください。

★for文

命令を集めたものが関数であるのは、先程述べました。しかし、同じ命令をダラダラ書いていたのでは、プログラムが長くなってしまいます。

var x=5;
x=x+1;
x=x+1;
x=x+1;

上の例ではx=x+1;の文が3つも出てきます。このような同じ文（又は、似たような文）をまとめるために、for文というのを使います。for文の書き方は、

for (変数＝初期値；変数＝繰り返し条件；変数＝変数の増加量)

まず、変数ですが、これは普通の変数と同じようなものです。ただし、一般的には（なぜか）i を使うことが多いです。また、初期値は0にするのが普通です。繰り返し条件は、変数がいくつになるまでfor文を続けるかの条件です。変数の増加量は、for文の中身を1回実行するたびに、変数の値をいくつ増やすかということを書きます。

for(i=0;i<3;i++)

のような場合は、i の中身が0,1,2の3回だけ繰り返すという意味です（i++ というのは、i=i+1と同じことです。通常の代入でも使えます）。先程の例をfor文で表現すると、以下のようになります。

var x=5;
var i;
for(i=0;i<3;i++){
x=x+1;
}

また、for文の中に、変数i を使うことも可能です。

var x=5;
var i;
for(i=0;i<3;i++){
x=x+i;
}

とすると、

i=0の時: x=5+0=5
i=1の時: x=5+1=6
i=2の時: x=6+2=7
i=3の時: 繰り返し条件が i<3 のため終了

となり、最終的にx=7になります。

★if文

if文というのは、条件分岐のことです。具体的に言うと、「○○の時は、命令Ａを実行して、そうでないときは、命令Ｂを実行する。」というものです。これをプログラムで書くと、

if (条件) {条件にあったときの命令} else {そうでないときの命令}
（elseは省略可能）

となります。条件の中身は、いろいろありますが、主なものを下に挙げておきます。

a==b: a と b が完全に一致する（文字列・数値とも）
a!=b: a と b が違う（文字列・数値とも）
a>b: a が b より大きい（数値のみ）
a<b: b が a より大きい（数値のみ）

if(x==5){
x=x+1;
}
else{
x=x+2;
}

とした場合は、ｘが5の時はｘに1を加え、それ以外の時は、ｘに2を加えます。

文については、他にもあるんですけど、だいたいこれくらい知っていればプログラムを書けるので、省略します。
さあ、次からいよいよゲームを書いていきますよ！

制作講座目次 / PREV（プログラムはどこに書くの？） / NEXT（イベントハンドラを使いこなせ）