我想了解我做错了什么,不允许将 countScore 保存到本地存储中(代码如下)。我有一种感觉,它涉及我如何调用 playerMove 函数以及导致对象无法设置的单独“if”语句。我不想完全重写我的代码,但如果这是唯一的选择,那么我可以自己重做代码。只是想知道如何使用我当前的代码将此对象保存到本地存储中。
HTML
<!DOCTYPE html>
<html>
<head>
<title>Rock, Paper, Scissors</title>
<link rel="stylesheet" href="RPS-style.css">
</head>
<body>
<h1>Rock Paper Scissors</h1>
<button onclick="pickRock()">Rock</button>
<button onclick="pickPaper()">Paper</button>
<button onclick="pickScissors()">Scissors</button>
<button onclick="resetScore()">Reset Score</button>
<p> Click <a href="">here</a> to see final version </p>
<script src="RPS.js"></script>
</body>
</html>
JS
const countScore = {
Wins: 0,
Losses: 0,
Ties: 0
};
localStorage.getItem(JSON.parse(JSON.stringify(countScore)));
// localStorage.getItem("gameScore");
computerMove = () => {
const randomizer = Math.random();
if (randomizer >= 0 && randomizer < 1/3) {
compChoice = "Rock"
}
else if (randomizer >= 1/3 && randomizer < 2/3) {
compChoice = "Paper"
}
else if (randomizer >= 2/3 && randomizer < 1) {
compChoice = "Scissors"
};
return compChoice;
};
playerMove = (pChoice) => {
let compChoice = computerMove();
if (compChoice === pChoice) {
countScore.Ties += 1;
result = alert(`Computer chose ${compChoice} - It's a tie!\n${score()}`);
} else if (compChoice === "Scissors" && pChoice === "Rock" || compChoice === "Rock" && pChoice === "Paper" || compChoice === "Paper" && pChoice === "Scissors") {
countScore.Wins += 1;
result = alert(`Computer chose ${compChoice} - ${pChoice} beats ${compChoice}, you win!\n${score()}`);
} else if (compChoice === "Paper" && pChoice === "Rock" || compChoice === "Rock" && pChoice === "Scissors" || compChoice === "Scissors" && pChoice === "Paper") {
countScore.Losses += 1;
result = alert(`Computer chose ${compChoice} - ${compChoice} beats ${pChoice}, you lose!\n${score()}`);
};
console.log(localStorage.setItem("gameScore", JSON.stringify(countScore)));
console.log(countScore);
// console.log(countScore);
// console.log(JSON.stringify(countScore));
// console.log(JSON.parse(JSON.stringify(countScore)));
};
score = () => {
return (`Wins: ${countScore.Wins}, Losses: ${countScore.Losses}, Ties: ${countScore.Ties}`);
};
resetScore = () => {
countScore.Wins = 0;
countScore.Losses = 0;
countScore.Ties = 0;
alert(score());
};
pickRock = () => {
computerMove();
playerMove("Rock");
};
pickPaper = () => {
computerMove();
playerMove("Paper");
};
pickScissors = () => {
computerMove();
playerMove("Scissors");
};
// localStorage.setItem("gameScore", JSON.stringify(countScore));
// console.log(countScore);
// console.log(localStorage.setItem("gameScore", JSON.stringify(countScore)));
我尝试将此步骤放在每个可能的位置,但总是返回“未定义”。
尝试重构以使代码以更少的行数运行。尝试了多条不同的线来放置它。尝试将分数从 if 语句中取出到它自己的单独函数中。回顾了如何正确存储和检索本地存储中的项目。
发帖寻求帮助,因为我可能会遗漏一些对专业人士来说显而易见的东西。
你应该这样做:
const gameScore = JSON.parse(localStorage.getItem("gameScore"));
使用保存后即可使用
localStorage.setItem("gameScore", JSON.stringify(gameScore))
如果该值尚未保存,则
JSON.parse(localStorage.getItem("gameScore"))
将返回null
。