新しいレッスンがあります
旧版のレッスンは更新を終了しており、現状と異なる場合があります。サポートも終了しておりますので、最新版への移行をお願いします。
-
#01 ナンバーズ - 画面を作る (01:33) 無料公開中
- buttonタグを使って3×3のボタンを作ります。
-
#02 initButtonsのコードを書く (02:45) 無料公開中
- forループとrandomを使ってランダムな0〜8の数値をボタンに割り当てていきます。
- console.dirを使って結果を確認します。
-
#03 initButtonsのコードを説明する (02:40)
- ループ内で何が起きているか、変数値の変化を見ながら解説します。
-
#04 ボタンに数値を表示する (01:54)
- getElementByIdとvalueを使ってボタンに数値を表示させます。
- 再読み込みをしてランダムに割り当てられているのを確認します。
-
#05 Clickイベントを設定する (01:16)
- onclickイベントをボタンに割り当てます。
- touchedという関数を作ります。
-
#06 ボタンを押した処理 (02:55)
- currentNumberという変数を作り、次に押すべきボタンの値を格納します。
- 押されたボタンの数値とcurrentNumberを比較します。
- 正解の数値を押したらボタンの数字を消します。
- 違う数値を押したらメッセージを表示させます。
-
#07 Game Over処理 (01:19)
- currentNumberが8以上になったらゲームオーバーのメッセージを表示させます。
-
#08 Score表示 (01:15)
- Scoreを保持する変数を用意します。
- Scoreを表示させるためのHTMLを書きます。
-
#09 Timer処理 (02:27)
- runTimerという関数を作り、setTimeoutでScoreをカウントしていきます。
- Scoreをリアルタイムに画面に表示させます。
- ゲームオーバー時にScoreを表示します。
