言語を学ぶ

JavaScriptでつくるHigher or Lower

JavaScriptでつくるHigher or Lower

チャプター:6

このブックでは、HTMLとJavaScriptを活用して 「Higher or Lower」というゲームを作成します。実際に一つのプログラムを作成してゆく中で、HTMLとJSを連携させたプログラミングがどのように行われるかを理解することが可能です。

1.ゲームのベースとなるHTML構造をつくろう

このチャプターでは、ゲームの基となるHTMLの構造を作成します。

42P

2.「変数」を宣言しよう

このチャプターでは、JavaScriptを使用して要素を編集するための準備として、変数の宣言を行います。「変数」とは、ある値やリストを プログラム中の任意の場所で使うことができるよう保存しておくための「箱」のようなもので、この箱を用意することを一般に「変数を宣言する」または「変数を定義する」と呼びます。

34P

3.ボタンを押したら判定が行われるようにしよう

このチャプターではボタンがクリックされた際の判定処理をつくっていきます。このチャプターを通してJavaScriptにおける「イベント」とは何かを理解することができます。

32P

4.「start関数」をつくろう

「start関数」は、ゲームの実行を行う関数になります。具体的な動きは次の通りです。 ● start関数に文字列"lower"を渡した場合 → 次の値が表示されている値より低かった場合スコアを1加算してゲーム続行、高かった場合ゲームオーバー」と。 ● start関数に"lower"以外の文字列("higher"など)を渡した場合 → 「次の値が表示されている値より高かった場合スコアを1加算してゲーム続行、低かった場合ゲームオーバー」。

40P

5.「check関数」をつくろう

check関数は選んだ予想が当たっているかどうかをチェックする関数で、具体的な動きは次の通りです。 ● 文字列"lower"を渡した場合 → 次の値が表示されている値より低かった場合 true、高かった場合 false を返す。 ● "lower"以外の文字列("higher"など)を渡した場合 → 次の値が表示されている値より高かった場合 true、高かった場合 false を返す。 なお、check関数は start関数とは異なり、選んだ予想が当たっているかどうか「のみ」を判断し、ゲームオーバー時の処理等は行いません。

46P

6.「get_random_value関数」をつくろう

get_random_value関数は 1から100までのランダムな整数値が返す関数です。

40P