如何实时更改设置间隔的速度
How to change the speed of setInterval in real time
我想知道如何实时更改setInterval的速度,例如:
if (score < 10)
repeater = setInterval(function() {
spawnEnemy();
}, 1000);
if (score => 10)
repeater = setInterval(function() {
spawnEnemy();
}, 500);
我知道这种方法不起作用,但是有没有办法以其他方式实现这一目标?
jsFiddle Demo
一旦运行,就无法更改间隔速度本身。唯一的方法是有一个速度变量,然后清除间隔并以新速度开始一个新的间隔。
var speed = 500;
var changeSpeed = speed;
repeater = setInterval(repeaterFn, speed);
function repeaterFn(){
spawnEnemy();
if( changeSpeed != speed ){
clearInterval(repeater);
speed = changeSpeed;
repeater = setInterval(repeaterFn, speed);
}
}
function changeRepeater(){
changeSpeed = 700;
}
另一种方法是只使用 setTimeout
而不是 setInterval
。 每次都进行检查,以便您可以将速度逻辑保存在单独的函数中。
var game_over = false;
var score = 0;
function getSpeedFromScore(score) {
if (score > 20) {
game_over = true;
}
if (score < 10) {
return 1000;
} else {
return 500;
}
}
function spawnEnemyThenWait() {
if (!game_over) {
spawnEnemy();
var speed = getSpeedFromScore(score);
setTimeout(spawnEnemyThenWait, speed);
}
}
function spawnEnemy() {
document.getElementById("output").textContent = "Enemey spawned: score " + score;
score++;
}
spawnEnemyThenWait();
<div id="output"></div>
JS小提琴 http://jsfiddle.net/bq926xz6/
您可以使用
clearInterval
:
if (score < 10) {
clearInterval(repeater);
repeater = setInterval(spawnEnemy, 1000);
}
if (score => 10) {
clearInterval(repeater);
repeater = setInterval(spawnEnemy, 500);
}
但这取决于上下文。如果此代码段的执行频率高于必须的执行频率,您将需要某种机制来防止它一直重置您的间隔。
但是(正如我在问题的评论中所写)没有办法使用clearInterval
并更改间隔本身。至少不会不将其替换为如上所示的新间隔。
您可以使用游戏循环并跟踪敌人职业中的生成状态:
// press f12 so see console
function Enemy() {
this.spawned = false;
this.spawnOn = 20;
this.tick = function() {
this.spawnOn = this.spawnOn - 1;
if (this.spawnOn == 0) {
this.spawned = true;
}
}
this.goBackToYourCage = function() {
this.spawnOn = Math.floor(Math.random() * 50) + 1;
this.spawned = false;
}
}
var enemy = new Enemy();
window.setInterval(function() {
enemy.tick();
if (enemy.spawned) {
console.log('spawned');
enemy.goBackToYourCage();
console.log('Next spawin in :' + enemy.spawnOn);
}
}, 100);
http://jsfiddle.net/martijn/qxt2fe8y/2/
相关文章:
- 在Phaser中设置汽车的最大速度和当前速度
- Jquery JScrollPane-设置滚动速度/灵敏度
- 如何实时更改设置间隔的速度
- 设置为“run_at”document_start“的 Chrome 扩展程序运行速度太快
- Famo.us 球拖放,释放时设置速度
- 设置超时 执行速度比分配的间隔快
- 在IE 8中以每秒50次的速度设置间隔slugish
- 设置可变间隔速度
- JS计数器:在一个函数中设置不同的速度(间隔)
- 设置操作中的间隔更改速度
- 在设置元素动画的过程中降低速度
- css翻转计数器-无法设置正确的速度
- 在jquery插件中设置fadeOut速度
- 有没有办法在鼠标悬停时设置转换速度
- 使用线性插值设置动画的速度不一致
- 减慢循环速度以设置“画布”的动画
- 如何设置下拉菜单的速度
- 防止setInterval()在设置点击次数后增加速度
- jQuery设置淡出的初始速度
- 设置相对于高度的过渡速度