使用setInterval将变量随时间递增

时间:2018-11-20 18:01:58

标签: javascript html

因此,现在,我是编码的初学者,并且setInterval命令存在很多问题。我想做的是有一个函数,该函数每经过5秒就会将变量减1。但是,尽管我使用有关setInterval命令的信息查看了许多不同的线程,但是它们似乎都不符合我的需求(尽管我可能错过了一些东西),而且我无法操纵在其他地方看到的任何东西来执行我的功能。

while (fullness <= 10) {
    setInterval(hungry{ fullness--; }, 1000);
}

4 个答案:

答案 0 :(得分:1)

为什么您的代码错误:

//There is no need to loop and call setInterval multiple times
//setInterval will fire the callback function every x milliseconds,
//In your example you have it firing every 1 second(1000 milliseconds)
//while (fullness <= 10) {
    //setInterval(hungry{ fullness--; }, 1000);
//}

要解决此问题: 页面加载时(jquery中的document.ready) 只需调用一次setInterval()

setInterval(function(){
   if(fullness <= 10){
      hungry{ fullness--; };  //Not sure about this line as it comes from your example
   }
}, 5000); //Pass second parameter to setInterval of 5000 milliseconds (5 seconds wait)

答案 1 :(得分:0)

您必须首先为setInterval设置一个变量,然后使用clearInterval停止迭代(这很重要,否则循环将无限期地进行迭代)。并检查填充度是否大于0。

var fullness = 10;
var timer = setInterval(function(){
   if(fullness > 0){
      fullness--;
   }
   else{
      clearInterval(timer);
   }
}, 5000);

这是工作中的jsFiddle

答案 2 :(得分:0)

您可能正在尝试以同步方式而非异步方式使用std::move

调用boost::array<int, 8> a; std::vector<int> v; v.reserve(a.size()); std::move(a.begin(), a.end(), std::back_inserter(v)); 时,它只会启动一个计时器,该计时器每setInterval()毫秒调用给定的setInterval(function, period)。调用function之后,javascript将继续立即执行下一行代码。如果您要在while循环结束后检查period的值,您可能会注意到它没有改变(但!)。

我建议您编写一个新函数来处理更改setInterval并对更改做出反应:

fullness

然后像这样使用fullness

function updateHunger() {
    fullness--;
    if (fullness < 10) {
        //Do something
    }
    else {
        //You have to call clearInterval() to stop the timer
        clearInterval(hungerTimer);
    }
 }

请记住在setInterval和调用//Using a variable to store the timer reference that we create hungerTimer = setInterval(updateHunger, 5000); 的方法都可以访问的范围内声明hungerTimer变量。

答案 3 :(得分:0)

您遇到这种情况的原因是JS在单个线程中运行。等待1秒钟来阻止它会使整个浏览器停止运行,这就是JS不允许它并且我们在JS中没有sleep()的原因,因为我们拥有Timers API。

但是,编写看起来像是同步的for循环是很不错的,因为这是我们“正常”思考的方式。这就是为什么现在使用带有异步和生成器支持的引擎实际上可以写出这样的东西:

// ES6 features

const sleeper = (x, timeout) =>
  new Promise(resolve => setTimeout(resolve, timeout, x));

function* timer(count, timeout) {
  for (let i = count; i >= 0; i--) {
    yield sleeper(i, timeout);
  }
}

async function main() {
  for (let i of timer(10, 1000)) {
    console.log(await i); // Blocks the main() function but not the JS main thread!
  }
}

main();  
console.log("The call to main() was non-blocking");