レッスン 3
クラスを使って書き換えよう
プレイヤークラスを作ってコードを整理しよう
チャプター1クラスが必要な理由
ここまでの学習でプレイヤーの基本的な動きのプログラムは完成しました。
今後、敵や弾の機能も作っていくので全体のコード量もだんだんと増えていきます。
そうなる前にプレイヤーの動作をPlayerクラスとして処理をまとめて整理してみましょう。
処理を整理する事により、どの部分のコードがプレイヤーについて記述しているのかが分かりやすくなります。
またクラスは設計図のような物なので、設計図を元に弾や敵など、同じ動作をする物を沢山作る事が簡単にできるようになります。
チャプター2プレイヤーの処理をクラスにまとめよう
下記のコードのコメントを参考にして、これまで作って来たプレイヤーの動作をプレイヤークラスを作って整理してみよう。
move()メソッドには移動と画面からはみ出した時の処理をまとまとめ、display()メソッドにはプレイヤー表示の処理をまとめよう。
//プレイヤーの変数
let player;
//初期設定
function setup() {
//キャンバスの生成
//rectの描画モードCENTERに設定する
//player変数にPleyerクラスのインスタンスを生成して代入、引数は(X座標・Y座標・サイズ・スピードx)
}
//繰り返し呼び出される描画処理
function draw() {
//背景色の設定
//プレイヤーの移動
//プレイヤーの表示
}
//プレイヤークラス
class Player {
//コンストラクタ()内はインスタンス生成時の引数になる
constructor(x, y, size, speedX) {
this.x = x;
this.y = y;
this.size = size;
this.speedX = speedX;
}
//移動と画面からはみ出した時の処理
move() {
}
//表示の処理
display() {
}
}