0

0

JavaScript 猜拳游戏:完善你的计分系统与逻辑

聖光之護

聖光之護

发布时间:2025-08-20 18:52:01

|

768人浏览过

|

来源于php中文网

原创

javascript 猜拳游戏:完善你的计分系统与逻辑

本文将引导你构建一个基于 JavaScript 的猜拳游戏,重点解决计分逻辑问题,并提供更简洁高效的实现方案。我们将深入探讨如何使用数组索引和模运算来简化胜负判断,同时优化用户输入验证,确保游戏的健壮性和用户体验。通过本文,你将掌握编写清晰、可维护的 JavaScript 代码的技巧,并提升解决实际编程问题的能力。

游戏框架搭建

首先,我们需要定义游戏的核心元素:rock(石头)、paper(布)、scissors(剪刀)。 将它们存储在一个数组中,方便后续的逻辑处理。

const choices = ['rock', 'paper', 'scissors'];
let playerScore = 0;
let computerScore = 0;

电脑的选择

getComputerChoice 函数负责随机生成电脑的选择。

function getComputerChoice() {
  return choices[Math.floor(Math.random() * choices.length)];
}

玩家的选择与验证

getPlayerChoice 函数负责获取玩家的输入,并进行有效性验证。 使用 prompt 接收用户输入,并使用循环确保输入是 choices 数组中的有效值。

立即学习Java免费学习笔记(深入)”;

function getPlayerChoice() {
  let choice;
  while(true) {
    choice = prompt('Pick Rock, Paper, or Scissors?').toLowerCase();
    if(choices.includes(choice)) return choice;
    else console.log('Invalid choice, please try again');
  }
}

胜负判断:核心逻辑优化

playRound 函数是游戏的核心,负责判断胜负并更新分数。 关键在于如何简化胜负判断的逻辑。 我们可以利用 choices 数组的索引,并结合模运算 % 来实现。

FaceSwapper
FaceSwapper

FaceSwapper是一款AI在线换脸工具,可以让用户在照片和视频中无缝交换面孔。

下载

核心思想:

  • Rock
  • 如果玩家的选择的索引比电脑的选择的索引大 1,则玩家获胜(考虑循环,使用模运算)。
function playRound(playerSelection, computerSelection) {
  if(playerSelection===computerSelection) {
    return 'Draw'
  }
  else if((((choices.indexOf(playerSelection) - choices.indexOf(computerSelection)) + 3) % 3)===1) {
    playerScore++
    return `You win! ${playerSelection} beats ${computerSelection}`
  }
  else {
    computerScore++
    return `You lose! ${computerSelection} beats ${playerSelection}`

  }
}

代码解释:

  • choices.indexOf(playerSelection) 获取玩家选择在 choices 数组中的索引。
  • choices.indexOf(computerSelection) 获取电脑选择在 choices 数组中的索引。
  • ((choices.indexOf(playerSelection) - choices.indexOf(computerSelection)) + 3) % 3 计算索引差,并使用模运算处理循环情况(例如,Rock 胜 Scissors 的情况)。
  • 如果结果为 1,则玩家获胜。

游戏主循环

game 函数负责控制游戏流程,进行 5 轮游戏,并最终输出结果。

function game() {
  for (let i = 1; i <= 5; i++) {
    const playerSelection = getPlayerChoice()
    const computerSelection = getComputerChoice()
    console.log(playRound(playerSelection, computerSelection))
  }

  if (playerScore > computerScore) {
    return 'You beat the computer! You are a genius'
  } else if (playerScore < computerScore) {
    return `You got beat by the computer. Practice your throws!`
  } else {
    return `You tied with the computer!`
  }
}

console.log(game())

完整代码

const choices = ['rock', 'paper', 'scissors'];
let playerScore = 0;
let computerScore = 0;

function getComputerChoice() {
  return choices[Math.floor(Math.random() * choices.length)];
}

function getPlayerChoice() {
  let choice;
  while(true) {
    choice = prompt('Pick Rock, Paper, or Scissors?').toLowerCase();
    if(choices.includes(choice)) return choice;
    else console.log('Invalid choice, please try again');
  }
}

function playRound(playerSelection, computerSelection) {
  if(playerSelection===computerSelection) {
    return 'Draw'
  }
  else if((((choices.indexOf(playerSelection) - choices.indexOf(computerSelection)) + 3) % 3)===1) {
    playerScore++
    return `You win! ${playerSelection} beats ${computerSelection}`
  }
  else {
    computerScore++
    return `You lose! ${computerSelection} beats ${playerSelection}`

  }
}

function game() {
  for (let i = 1; i <= 5; i++) {
    const playerSelection = getPlayerChoice()
    const computerSelection = getComputerChoice()
    console.log(playRound(playerSelection, computerSelection))
  }

  if (playerScore > computerScore) {
    return 'You beat the computer! You are a genius'
  } else if (playerScore < computerScore) {
    return `You got beat by the computer. Practice your throws!`
  } else {
    return `You tied with the computer!`
  }
}

console.log(game())

注意事项与总结

  • 代码可读性 编写清晰、易于理解的代码至关重要。 使用有意义的变量名和注释,使代码更易于维护。
  • 用户体验: 完善的用户输入验证可以提高用户体验。 确保程序能够处理各种异常情况。
  • 逻辑优化: 使用数组索引和模运算可以简化胜负判断逻辑,使代码更简洁高效。
  • 模块化: 将代码分解为更小的函数,可以提高代码的可重用性和可测试性。

通过本文,你学习了如何构建一个基于 JavaScript 的猜拳游戏,并掌握了优化计分逻辑和用户输入验证的方法。 记住,编写清晰、可维护的代码是成为一名优秀程序员的关键。 持续学习和实践,你将能够解决更复杂的编程问题。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
go语言 注释编码
go语言 注释编码

本专题整合了go语言注释、注释规范等等内容,阅读专题下面的文章了解更多详细内容。

2

2026.01.31

go语言 math包
go语言 math包

本专题整合了go语言math包相关内容,阅读专题下面的文章了解更多详细内容。

1

2026.01.31

go语言输入函数
go语言输入函数

本专题整合了go语言输入相关教程内容,阅读专题下面的文章了解更多详细内容。

1

2026.01.31

golang 循环遍历
golang 循环遍历

本专题整合了golang循环遍历相关教程,阅读专题下面的文章了解更多详细内容。

0

2026.01.31

Golang人工智能合集
Golang人工智能合集

本专题整合了Golang人工智能相关内容,阅读专题下面的文章了解更多详细内容。

1

2026.01.31

2026赚钱平台入口大全
2026赚钱平台入口大全

2026年最新赚钱平台入口汇总,涵盖任务众包、内容创作、电商运营、技能变现等多类正规渠道,助你轻松开启副业增收之路。阅读专题下面的文章了解更多详细内容。

76

2026.01.31

高干文在线阅读网站大全
高干文在线阅读网站大全

汇集热门1v1高干文免费阅读资源,涵盖都市言情、京味大院、军旅高干等经典题材,情节紧凑、人物鲜明。阅读专题下面的文章了解更多详细内容。

73

2026.01.31

无需付费的漫画app大全
无需付费的漫画app大全

想找真正免费又无套路的漫画App?本合集精选多款永久免费、资源丰富、无广告干扰的优质漫画应用,涵盖国漫、日漫、韩漫及经典老番,满足各类阅读需求。阅读专题下面的文章了解更多详细内容。

67

2026.01.31

漫画免费在线观看地址大全
漫画免费在线观看地址大全

想找免费又资源丰富的漫画网站?本合集精选2025-2026年热门平台,涵盖国漫、日漫、韩漫等多类型作品,支持高清流畅阅读与离线缓存。阅读专题下面的文章了解更多详细内容。

19

2026.01.31

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Excel 教程
Excel 教程

共162课时 | 14.7万人学习

Go语言web开发--经典项目电子商城
Go语言web开发--经典项目电子商城

共23课时 | 1.3万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号