じゃんけんゲーム

<div class="flex">
  <!-- じゃんけんのボタン。関数を呼び出し、それぞれ異なる引数を渡しています。  -->
  <!-- グー：０　チョキ：１　パー：２　として扱い、JavaScriptでも同じ意味合いで扱います。  -->
  <div class="is-style-btn_normal">
    <button type="button" onclick="buttonClick(0)" >グー</button>
  </div>
  <div class="is-style-btn_normal">
    <button type="button" onclick="buttonClick(1)">チョキ</button>
  </div>
  <div class="is-style-btn_normal">
    <button type="button" onclick="buttonClick(2)">パー</button>
  </div>
</div>
<output id="result">
勝敗は...
</output>

button {
    color: #fff;
    font-weight: 700;
    transition: box-shadow .25s;
    box-shadow: var(--swl-btn_shadow);
    background: var(--the-btn-bg);
    border-radius: var(--the-btn-radius, 0);
    display: inline-block;
    letter-spacing: var(--swl-letter_spacing, 1px);
    line-height: 1.5;
    margin: 0;
    min-width: var(--the-min-width);
    padding: var(--the-padding);
    position: relative;
    text-decoration: none;
    width: var(--the-width);
}
.flex{
    display: flex;
}
output{
  background:aqua;
}

/*
じゃんけんゲームのプログラム
整数を使って判定するため、手と数値は下記に示す。
グー：０　チョキ：１　パー：２
 */
//  乱数生成関数
//  引数：整数
//  戻り値：0以上、引数未満のランダムな整数を戻す。
function getRandomInt(num) {
  return Math.floor(Math.random() * num);
}
//  じゃんけんの判定
//  引数：hand1,hand2(値：0,1,2)
//  戻り値：hand1から見て　あいこ＝０　負け＝１　勝ち＝２
function getJudgement(hand1,hand2){
  return ( hand1 - hand2 + 3 ) % 3;
}
//  表示関数
//  引数：hand1,hand2 (値：0,1,2)
//  戻り値：なし
function print(hand1,hand2){
  const hand = new Array("グー","チョキ","パー");
  const winOrLose = new Array("あいこ","負け","勝ち");
  const ans = getJudgement(hand1,hand2);

  const elem = document.getElementById("result");
  elem.value= "あなたは" + hand[hand1] + "　わたしは" + hand[hand2] + "　勝敗は" + winOrLose[ans] ;

}
//  ボタンクリック時に動く関数
//  引数：you （値：0,1,2）
//  戻り値：なし
function buttonClick(you){
  const me = getRandomInt(3);
  print(you,me);
}