标签：false localStorge JavaScript localStorage localstorage 返回值 null maxScore
------------恢复内容开始------------
问题来源:在将2048游戏发布到github pages时,发现了最高分显示一直为null
当score变换了,best依旧为null
发现不管如何移动localStorge存储的一直都是null,但是在webstorm运行时,没有出错,且能获取到localStorge. vscode和github上面的都是同样的错误,那一定是代码出现了问题.
localStorge
localStorage 中的键值对总是以字符串的形式存储,不受页面刷新的影响,也不会因为关闭窗口,变迁也重启浏览器而丢失,所以我选择它来存储最高分数.
回到设置localStorge的地方发现了错误原因
因为我最开始就没有设置localStorage,而先去获取这个值，在获取不存在的localstorage时，会返回null。
localStorage.getItem("max");
null
localStorage.setItem("max",null)
undefined
localStorage.getItem("max");
"null"
然后游戏开始时，在 this.maxScore = this.maxScore > c ? this.maxScore : c;
0>null?0:null会返回null，this.maxScore=null,就把null存到了localstorage里
存的时候null就变成了"null"(String),第二次更新最高分数时，c="null",在下一步比较中 "null"转成数字是NaN无法参与比较,
0>null?0:null
33>'null' //false，则max保存的还是null，所以最高分显示一直为null。
测试了下null与其他值的比较
0>null
false
null<2
true
null<0
false
null>0
false
null==0
false
null<1
true
null<'a'
false
webstorm能正常运行,，VSCODE为null
因为我前面一直在完善程序，localStorage早就已经保存了，所以在判断时不影响。因为localStorage 中的键值对总是以字符串的形式存储,不受页面刷新的影响,也不会因为关闭窗口,变迁也重启浏览器而丢失。在webstorm打开的浏览器手动移除localstorage后就会出现相同的问题。也可以在代码中使用removeItem（）移除。
总结
有两种改进方法
1.使用Number（）
在第一次设置localStorage时，将null转为0，
注意'null'字符串是无法转换的
2.在初始化时检测一下有没有缓存
就开始检测一下有没有缓存，没有就放个0进去.
if(!localstorage.getitem('maxscore')){
localstorage.setitem('maxscore',0)
}
不过两种方法好像都有点点不太优雅？
出现这个问题的原因，是对localStorage的存储已经生存周期不清楚，还有对js的类型转换也有没有注意到。
以后使用localStorage时，定期清除一下。注意js中常见的隐式转换！
标签：false,localStorge,JavaScript,localStorage,localstorage,返回值,null,maxScore 来源： https://www.cnblogs.com/My-Coding-Life/p/14786281.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。