javascript - 用数组保存值的抛硬币游戏
问题描述
我只是在学习 Javascript 的基础知识,但对 Java 有很多了解,我知道我做错了,只是在寻找正确的方法。我正在尝试在文本字段中输入一个数字,并生成与文本字段编号指定的 1-2 之间的随机数。然后将这些数字(一堆 1 和 2)存储在一个数组中,然后使用 for 循环在数组中循环以计算有多少正面或反面,并打印出来。
预期输出://输入的数字是 10。正面
数 = 7,反面数 = 3
<!DOCTYPE html>
<html>
<head>
<title>Coin Tosser</title>
</head>
<body>
<h1>COINTOSSER</h1>
<div id = "NumOfTosses">
<input type = "text" id ="num">
</div>
<button id = "click" type="button">Start Tossing</button>
<script>
var numT = document.getElementById('num').value
document.getElementById('click').onclick = toss;
function toss(){
var tossArray = [];
for(var i = 0;i<numT;i++){
var rng = Math.floor(Math.random() * 2);
tossArray.push(rng);
}
var heads = 0;
var tails = 0;
for(var j = 0;j<tossArray.length;j++){
if(tossArray[j] == 0){
heads++;
}else{
tails++;
}
}
alert("Number of heads = " + heads + " and number of tails = " + tails);
}
</script>
</body>
</html>
解决方案
我已经评论了我在哪里进行了更改以及为什么。
关键点是,由于您正在计算 2 个值,因此您可以将每个值的计数存储在数组的索引中,而不是每次发生 2 个选项之一时都用新值填充数组。
这可以让您切断计数循环,使您的程序更加高效,始终尝试在添加时计数,而不是在最后添加然后计数。
rng
另外,每次调用方法时都需要刷新值,所以我把它移到了函数的顶部。
搏一搏!
<!DOCTYPE html>
<html>
<head>
<title>Coin Tosser</title>
<style>
/*Fun CSS added */
@keyframes flip{
50%{
transform: rotate(181deg);
}
100%{
transform: rotate(360deg);
}
}
html{
background-color:lightgrey;
}
h1{
background-color:grey;
border-radius:25px;
border:1px solid black;
}
button{
background-color:gold;
border-radius:25px;
padding:5%;
}
button:hover {
animation-name:flip;
animation-duration:1s;
}
</style>
</head>
<body>
<h1>COINTOSSER</h1>
<div id = "NumOfTosses">
<input type = "text" id ="num">
</div>
<button id = "click" type="button">Start Tossing</button>
<script>
document.getElementById('click').onclick = toss;
function toss(){
var numT = document.getElementById('num').value // Move numT initalization to method so it is set each time the method is run
var tossArray = [0,0];// change array to just count each index.
//E.G, if 1 happens '4' times, tossArray[1] will be 10.
for(var i = 0;i<numT;i++){
var rng = Math.floor(Math.random() * 2);
tossArray[rng]=tossArray[rng]+1;
}
alert("Number of heads = " + tossArray[0] + " and number of tails = " + tossArray[1]);
}
</script>
</body>
</html>
推荐阅读
- reactjs - React-native redux localId 不会从“null”更改
- swift - SwiftUI - TabView 中的 OnExitCommand
- javascript - 使用 React-Syntax-Highlighter 启用换行?
- c# - 寻找一种在 C# 中调用 pacman 并通过 MINGW64 进行制作的方法
- ansible - Ansible/Jinja 模板
- python - 类装饰器中的 lambda 上的 inspect.getcode 返回 PY3 中的整个类
- python - 用于 Python 中 ODE 集成的 Runge–Kutta 方法,具有附加约束
- python - Selenium 错误:此版本的 ChromeDriver 仅支持 Chrome 版本 81
- python - 编写一个使用循环实现各种算法的 Python 程序
- mysql - 表“test_db.colors”不存在