今日はリファクタリングをしました。
リファクタリングとは、プログラミングにおいて、外部から見た動作を変えずにソースコードの内部構造を整理することです。
どう変わったか、一部イベント処理の変更前後をお見せします。
変更前のコード：
function handleMouseDown(event) {
let x = event.pageX - _canvasOffsetX;
let y = event.pageY - _canvasOffsetY;
〜略〜
if (_ui.vals.size.hitBtn(x, y)) {
// スライダーのつまみ
_ui.vals.size.touchStartBtn(x);
} else if (_ui.vals.size.hitDown(x, y)) {
// ダウン
if (_ui.vals.size.down(1)) {
_ui.create(_gl, _bFS);
_life = new SF_Life(_gl, _canvas, _canvas.width / _ui.vals.size.now, _canvas.height / _ui.vals.size.now);
}
} else if (_ui.vals.size.hitUp(x, y)) {
// アップ
if (_ui.vals.size.up(1)) {
_ui.create(_gl, _bFS);
_life = new SF_Life(_gl, _canvas, _canvas.width / _ui.vals.size.now, _canvas.height / _ui.vals.size.now);
}
} else if (_ui.vals.size.hitSlider(x, y)) {
// スライダーのどこか
if (_ui.vals.size.touchStart(x)) {
_ui.create(_gl, _bFS);
}
}
if (_ui.vals.gen.hitBtn(x, y)) {
// スライダーのつまみ
_ui.vals.gen.touchStartBtn(x);
} else if (_ui.vals.gen.hitDown(x, y)) {
// ダウン
if (_ui.vals.gen.down(1)) {
_ui.create(_gl, _bFS);
_updateTime = 1000.0 / _ui.vals.gen.now;
_updateElapsed = 0;
}
} else if (_ui.vals.gen.hitUp(x, y)) {
// アップ
if (_ui.vals.gen.up(1)) {
_ui.create(_gl, _bFS);
_updateTime = 1000.0 / _ui.vals.gen.now;
_updateElapsed = 0;
}
} else if (_ui.vals.gen.hitSlider(x, y)) {
// スライダーのどこか
if (_ui.vals.gen.touchStart(x)) {
_ui.create(_gl, _bFS);
}
}
〜略〜
}
変更後のコード
function handleMouseDown(event) {
let x = event.pageX - _canvasOffsetX;
let y = event.pageY - _canvasOffsetY;
〜略〜
for (let key in _ui.vals) {
if (void 0 != _ui.vals[key].touchMove) {
_ui.vals[key].touchMove(x, y);
}
}
〜略〜
}
各UIのクラスにtouchMoveメソッドを持たせて、処理を任せるような構成に変更しました。
外見上変わってないからって「サボってんじゃねえ！」と言ってはいけません。
リファクタリングしないプログラムなんて、ずっと掃除していないゴミ屋敷と一緒です。火がつけばあっと言う間に燃え広がりますよ？
・・・あれ？これ上手いこと言ったんじゃない？
今日の作業は以上です！