HTML5 网络存储整数变为 NaN

Question

谁能解释为什么最后一行结果为 NaN？ 'userScore' 是一个 span 元素的对象，当我不实现 localStorage 部分时，类似的操作工作得很好。提前谢谢了！

    var score;
    score = 20 - (parseInt(turnNr.innerHTML) - bricks.length / 2) * 
    1.2;
    if (score >= 0.5) {
        score = Math.round(score);
    } else {
        score = 0;
    }

    if (localStorage.totalScore) {
       localStorage.totalScore = parseInt(localStorage.totalScore) + 
        score;
    } else {
        localStorage.totalScore = score;
    }
    userScore.innerHTML = localStorage.totalScore;

Answer 1

您的代码无法从错误中恢复。一旦将 "NaN" 存储在 localStorage 中，它就不会在代码执行时消失。那是因为 if (localStorage.totalScore) 将运行即使存在无效值。

您需要将代码更改为

if (parseInt(localStorage.totalScore)) { // NaN is falsy and will be ignored
   localStorage.totalScore = parseInt(localStorage.totalScore) + score;
} else {
    localStorage.totalScore = score;
}
userScore.innerHTML = localStorage.totalScore;

HTML5 网络存储整数变为 NaN

HTML5 web storage integer becomes NaN

javascript

html

nan

web-storage