見出し画像

#26 カードの判定処理を実装する:React でプロプラ! Vol.3 「BlackJack」

「React.js でプログラミング・プラモデル」の連載第3弾。
React.js で、カジノゲーム「BlackJack」を作ろう!

これまで

前回は、ハンドがブラックジャックかどうかを判定する処理を実装しました。

現時点の Sandbox

前回までの Sandbox はこちら。
はじめての方は、ここから一緒に作り始めることができます。

今回のゴール

・カードが Ace であるかを判定する
・カードが 10 またはフェイスカード(J, Q, K)のいずれかであるかを判定する

今回の設計書

src/utils/BlackJackUtils.js

Ace カード判定
// function isAce(card) を見つけてください
-----
1. card.rank の値が "A" のとき
 1.1 true を返却する
2. それ以外
 2.1 false を返却する
src/utils/BlackJackUtils.js

フェイスカード or 10 カード判定
// function isFaceCardOrTen(card) を見つけてください
-----
1. card.rank が "10", "J", "Q", "K" のいずれかであるとき
 1.1 true を返却する
2. それ以外
 2.1 false を返却する

ヒント

・手数はなるべく減らすようにコーディングしよう!

// 極端なサンプル
// before
function isSomething(obj){
	const target = obj.someProps;
	let result = undefined;
	if(target === 'あなたは期待する値ですか?'){
		result = true;
	}else{
		result = false;
	}
	return result;
}

// after
function isSomethingB(obj){
	return obj.someProps === 'あなたは期待する値ですか?';
}

console.log(isSomething({someProps: 'あなたは期待する値ですか?'}))
console.log(isSomethingB({someProps: 'あなたは期待する値ですか?'}))

・ブラックジャックでは、フェイスカードは全て 10 と数えるよ!フェイスカードのときに 10 を返してくれる関数は前に作ったよ!

実装例

カードの判定はできましたか?
不要な変数を定義しちゃってること、ありますよね。
コードを書いたら、もっとスリムにできないか見直してみましょう!

次回

気づいたら、「フェイスカード」が予測変換で「フェイスガード」になってしまっていました。時代ですね〜。
次回は、「最初に配られたハンドがブラックジャックかどうか」を判定します!

この記事があなたのお役に立ちましたら、よろしければサポートをお願いいたします! より良い記事をお届けできるよう、活動費に充てさせていただきます。