Javascript-石头剪刀布[简易版本]

Dan want to learn

已于 2024-05-11 11:48:31 修改

阅读量841

点赞数 11

文章标签： javascript 开发语言

于 2024-05-06 14:39:04 首次发布

本文链接：https://blog.youkuaiyun.com/m0_58777269/article/details/138489939

版权

Javascript-石头剪刀布[简易版本]

前瞻

前瞻

本次采用了function + button来复现一个简单的石头剪刀布，从而实现了Markdown

function

首先这个功能需要做到可以实现利用random来实现区分石头，剪刀，布

先生成一个随机数字 randomNumber = Math.random();
然后根据三个区间分别来完成对应石头，剪刀，布的区分
为了保证函数可以被调用，需要设置onclick的参数computerMove

需要注意的一点：

很多时候在function里面声明的变量就是只能在function里面是用的，如果想在function外调用对应的参数变量需要直接将参数声明在函数外面，变化为全局变量（本次在这里需要注意的全局参数就是computerMove）
需要注意function如果就是默认参数就会还好，但是如果自带初始化的数值那么就可以采用自带的参数数值

代码块-最基础版本

<!DOCTYPE html>
<html>

<head>
  <title>RPS</title>
</head>

<body>
  <P>Rock Paper Scissors</P>

  <button onclick="
    playGame('rock');
 ">Rock</button>


  <button onclick="
    playGame('paper');
 ">Paper</button>


  <button onclick="
     playGame('scissors');
  ">Scissors</button>

  <script>
    function playGame(playerMove) {
     
      const computerMove = pickComputerMove();
      let result = '';
      if (playerMove === 'scissors') {
     
        if (computerMove === 'rock')
          result = 'You are lose.';
        else if (computerMove === 'paper')
          result = 'you win.';
        else if (computerMove === 'scissors')
          result = 'Tie .';

        alert(`You picked scissors, Computer picked ${
       computerMove}. ${
       result}`)

      }

      else if (playerMove === 'rock') {
     
        if (computerMove === 'rock')
          result = 'Tie';
        else if (computerMove === 'paper')
          result = 'you win.';
        else if (computerMove === 'scissors')
          result = 'you are lose.';

        alert(`You picked rock, Computer picked ${
       computerMove}. ${
       result}`)

      }

      else if (playerMove === 'paper') {
     
        if (computerMove === 'rock')
          result = 'You win.';
        else if (computerMove === 'paper')
          result = 'Tie.';
        else if (computerMove === 'scissors')
          result = 'you are lose';

        alert(`You picked paper, Computer picked ${
       computerMove}. ${
       result}`)

      }
    }


    function pickComputerMove(playerMove) {
     
      const randomNumber = Math.random();

      if (randomNumber >= 0 && randomNumber < 1 / 3)
        computerMove = 'rock';
      else if (randomNumber >= 1 / 3 && randomNumber < 2 / 3)
        computerMove = 'paper';
      else if (randomNumber >= 2 / 3 && randomNumber < 1)
        computerMove = 'scissors';

      return computerMove;
    }


  </script>
</body>

</html>

实现效果如下图：
在这里插入图片描述

有重制分数版本

<!DOCTYPE html>
<html>

<head>
  <title>RPS</title>
</head>

<body>
  <P>Rock Paper Scissors</P>

  <button onclick="
    playGame('rock');
 ">Rock</button>


  <button onclick="
    playGame('paper');
 ">Paper

最低0.47元/天解锁文章