Javascript 按键事件后启动秒表
Javascript start stopwatch after keyevent
我正在开发一款包含 canvas 元素的游戏。目标是当您第一次按下某个键时,它会启动秒表。它应该在 gameoverscreen/winscreen 出现后立即结束。
在 gameoverscreen/winscreen 之后它应该像以前一样工作(如果按下键而不是启动秒表)
问题是函数只调用一次就可以了
代码(最重要的部分):
function startTime(){
startTime = function(){};
var count = 0;
function stopwatch(){
if(winScreen || gameOver){
count = 0;
} else{
console.log(count++);
}
}
setInterval(stopwatch, 1000);
}
document.addEventListener('keydown', function(event){
startTime();
});
有办法解决这个问题吗?
问题的原因是您在第二行用空函数覆盖了 startTime。第二次调用 startTime() 时,它运行空函数。
为了保持您的代码整洁,您的秒表不应该真正检查获胜或游戏结束条件 - 它应该只记录计数。只要出现这些情况,您的其余游戏代码就可以启动和重置秒表。你可以有一个像这样的秒表对象:
var stopwatch = {
count: 0,
intervalId: null,
start: function() {
stopwatch.intervalId = setInterval(function() {
stopwatch.count++;
}, 1000)
},
reset: function() {
if (stopwatch.intervalId) {
clearInterval(stopwatch.intervalId);
stopwatch.intervalId = null;
}
stopwatch.count = 0;
}
}
然后您的游戏可以在开始时调用 stopwatch.start() 并在结束时调用 stopwatch.reset()。
请注意,它在重置时也会清除间隔。如果没有这个,setInterval 中的函数每次都会重复,导致潜在的错误和内存泄漏。
我正在开发一款包含 canvas 元素的游戏。目标是当您第一次按下某个键时,它会启动秒表。它应该在 gameoverscreen/winscreen 出现后立即结束。
在 gameoverscreen/winscreen 之后它应该像以前一样工作(如果按下键而不是启动秒表)
问题是函数只调用一次就可以了
代码(最重要的部分):
function startTime(){
startTime = function(){};
var count = 0;
function stopwatch(){
if(winScreen || gameOver){
count = 0;
} else{
console.log(count++);
}
}
setInterval(stopwatch, 1000);
}
document.addEventListener('keydown', function(event){
startTime();
});
有办法解决这个问题吗?
问题的原因是您在第二行用空函数覆盖了 startTime。第二次调用 startTime() 时,它运行空函数。
为了保持您的代码整洁,您的秒表不应该真正检查获胜或游戏结束条件 - 它应该只记录计数。只要出现这些情况,您的其余游戏代码就可以启动和重置秒表。你可以有一个像这样的秒表对象:
var stopwatch = {
count: 0,
intervalId: null,
start: function() {
stopwatch.intervalId = setInterval(function() {
stopwatch.count++;
}, 1000)
},
reset: function() {
if (stopwatch.intervalId) {
clearInterval(stopwatch.intervalId);
stopwatch.intervalId = null;
}
stopwatch.count = 0;
}
}
然后您的游戏可以在开始时调用 stopwatch.start() 并在结束时调用 stopwatch.reset()。
请注意,它在重置时也会清除间隔。如果没有这个,setInterval 中的函数每次都会重复,导致潜在的错误和内存泄漏。