JavaScriptを使ってオリジナルの単語タイピングゲームを作っていきます。

単語タイピングゲーム作りを通してリアルタイム入力、文字列の操作、タイマーによるプログラムの自動実行、簡単なアニメーションなど実践的なプログラミング技術を学んでいきます。

「JavaScriptでプログラミング入門」の応用編になりますので、まだ終えてない方はそちらを先にご覧ください。

ＯＳ

Windows10

ブラウザ

Internet Explorer11

Microsoft Edge

Google Chrome

※上記環境にて動作確認しましたが、もし動作しない場合はご了承ください

使い方

640×480ぐらいのサイズの背景用の画像をプログラムを保存する場所と同じ場所に

「img1.jpg」「img2.jpg」「img3.jpg」「img4.jpg」

の名前で４枚用意した上で目次の完成ソースファイル開く→[ctrl+a]ですべて選択→[ctrl+c]でコピー→テキストエディタを開いて[ctrl+v]で貼り付け「html」ファイルとして保存、実行してください。

操作方法

アルファベットのみの簡単なタイピングゲームになります。英単語が横から流れてくるので画面の外に出る前に半角小文字で入力していってください。

内容

こちらは「JavaScriptでプログラミング入門」を終えた方向けに実用的なプログラムの入門として、簡単なタイピングゲームの作成を目指した内容となっております。

注意

自作関数にはわかりやすいように先頭に「my」とつけてあります。

現在のプログラミング手法には合ってない表現などもありますので、あくまでも入門としてお使いください。

1日目 タイピングゲームの考え方