昨日のFizzBuzz につづいて、思考力の向上のためにじゃんけんゲームをつくってみました。
UIはつくってないのでコンソールにひっそり結果が出力されます。
仕様
- プレイヤーが手を選択すると、相手の出した手と勝敗が出力される。
実装してみて気づいたこと
- じゃんけんは場に2種類の手があるときのみ勝敗がつく。(1種類、3種類はあいこ)
- 自分の手と誰も出していない手が解れば勝敗の判定ができる。
HTML
<ul id="btns"> <li id="btnG" data-index="0">ぐー</li> <li id="btnC" data-index="1">ちょき</li> <li id="btnP" data-index="2">ぱー</li> </ul>
JavaScript
(function(win, doc) { "use strict"; var G = "ぐー", C = "ちょき", P = "ぱー", ENEMY_NUM = 1, // 敵の人数 gcpNameList = [G, C, P], resultNames = { draw : "【ひきわけ】", win : "【かち】", lose : "【まけ】" }, gIndex = gcpNameList.indexOf(G), cIndex = gcpNameList.indexOf(C), pIndex = gcpNameList.indexOf(P); main(); function main() { var game = new Game(ENEMY_NUM), // 引数は敵の数 btns = doc.querySelector("#btns"), btnG = doc.querySelector("#btnG"), // ぐー btnC = doc.querySelector("#btnC"), // ちょき btnP = doc.querySelector("#btnP"); // ぱー btns.addEventListener("click", handleClickBtns, false); function handleClickBtns(evt) { var index = evt.target.getAttribute("data-index") - 0; console.log(gcpNameList[index] + "->"); console.log(game.pom(index)); console.log("________________________"); } } function Game(opt_enemyNum) { var gcpLists = {}, gcpListsLength = 0, enemyNum = opt_enemyNum || 1; function _init() { gcpLists = [ [], // ぐー [], // ちょき [] // ぱー ]; gcpListsLength = Object.keys(gcpLists).length; } function _pomEnemy() { var index = Math.random() * gcpListsLength | 0; gcpLists[index].push("e"); console.log("<-" + gcpNameList[index]); } function _getResult(index) { var glength = gcpLists[gIndex].length, clength = gcpLists[cIndex].length, plength = gcpLists[pIndex].length; if (_isDraw()) { return resultNames.draw; } else if (_isWin()) { return resultNames.win; } else { return resultNames.lose; } function _isDraw() { if (glength && clength && plength) { // 111 return true; } if ((glength || -1) * (clength || -1) * (plength || -1) > 0) { // 200 020 002 return true; } return false; } function _isWin() { // 右隣のキューのlengthが0じゃなかったら勝利 if (gcpLists[(index + 1) % 3].length) { return true; } } } function pom(gcpIndex) { var i = 0, max = enemyNum; _init(); while (max--) { _pomEnemy(); } gcpLists[gcpIndex].push("P"); return _getResult(gcpIndex); } return { pom : pom }; } })(this, document);
ざっと読み返して、変数名とコメントがわかりにくいことに気が付きました。
ロジックに関しても良いアプローチがあると思いますが、今回のところは動いたのでOKとしておきます。
今回は以上です。