为何添加变量后程序失效？移除framesPerSecond变量则运行正常求助

嘿，作为编程新手遇到这种变量导致的问题太正常了！我来帮你拆解下可能的原因，以及对应的排查方向：

1. 变量命名冲突 #

最常见的原因就是这个framesPerSecond变量名和全局环境里的其他东西撞车了——可能是浏览器自带的API、你引入的第三方库（比如动画、游戏类库）里已经有同名的全局变量了。当你用var声明这个变量时，会覆盖掉原有的那个变量，而原本的代码是依赖那个变量的功能才能正常运行的，一覆盖程序自然就卡壳了。

2. 未初始化或错误的变量值 #

如果你的代码里用到这个变量做计算（比如设置动画定时器：setInterval(update, 1000/framesPerSecond)），但你只是声明了var framesPerSecond却没给它赋值，那它的初始值是undefined。用undefined做除法会得到NaN，定时器就无法正常触发，看起来程序就像停止运行了一样。

3. 作用域与执行顺序问题 #

哪怕你把变量放在window.onload里，也可能出问题：如果window.onload之外的代码提前引用了framesPerSecond，由于变量提升的特性，这个变量会被提前声明但未赋值（值为undefined），那提前引用的代码就会拿到错误的值，导致程序在onload执行前就出错崩溃了。

几个快速排查的小技巧： #

• 按下F12打开浏览器控制台，查看有没有红色的报错信息——这是定位问题最快的方式，报错会告诉你到底是哪行代码、什么原因出的问题。
• 把变量名改成更独特的名字试试，比如myGameFPS，看看程序能不能恢复正常，以此验证是不是命名冲突的问题。
• 给变量一个明确的初始值，比如var framesPerSecond = 60;，确保它不是undefined或者无效值。
• 检查所有用到这个变量的代码，确保它们是在变量赋值之后才运行的（比如都放在window.onload里面，或者用DOMContentLoaded事件确保DOM和变量都准备好）。

内容的提问来源于stack exchange，提问作者pgp