【javascript】 Math.random()とMath.floorでじゃんけんアプリを作る
簡単なジャンケンアプリのコードを紹介します。ジャンケンの画像はフリーの素材から取得してください。
<div style="margin: 20px; text-align: center;">
<img id="janken" src=""/> <br>
<button id="btn1">クリック!</button>
</div>
const btn1 = document.getElementById("btn1");
const janken = document.getElementById("janken");
const jankenarr = [
"画像のパス(グー)",
"画像のパス(チョキ)",
"画像のパス(パー)",
];
btn1.addEventListener("click", () => {
// 整数をランダムに生成する
let jankenId = Math.floor(Math.random() * jankenarr.length);
janken.src = jankenarr[jankenId]; // 生成された数字を配列番号に指定する
});
参考
【javascript】配列からひとつづつ表示し、表示されたものは配列から削除していく方法。
【javascript】 ランダムな数を生成するMath.random()
【javascript】 配列を削除、追加するarray.splice()メソッドについて
【javascript】配列の中身を追加(push, unshift)、削除(pop,
shift)する方法
let Id =
Math.floor(Math.random() * array.length);
配列の数をランダム生成し、Id
に入れる。
array[ Id ] : 生成した数字を配列番号に代入