setInterval未使用参数调用函数

我试图使用setInterval重复调用一个函数。当我调用一个没有参数的函数时，它是有效的。但是，在使用参数调用函数时，该函数只被调用一次。

这是js小提琴

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script src="./check.js">
</script>
</body>
</html>

check.js没有参数-工作

setInterval(myfun,100)
var mycounter = 0;
function myfun()
{
    console.log(mycounter++)
}

check.js带有参数-不起作用

setInterval(myfun(0),1000)
function myfun(mycounter)
{
    console.log(mycounter++)
}

添加括号后，会立即调用函数，并在间隔中使用返回的结果，在您的情况下，这是undefined的默认返回值。

你真正做的是

var result = myfun(0); // returns undefined
setInterval(result, 1000); // no go, result is undefined
function myfun(mycounter) {
}

如果你想传递参数，最简单的方法就是使用匿名函数

setInterval(function() {
    myfun(0);
}, 1000);

现代浏览器（不是IE9及以下版本）现在支持直接在setInterval 中传递参数

setInterval(myfun, 1000, 0); // "0" is passed as the first argument to myfun()

当然，只有当变量存在于

间隔的回调函数之外的范围中时，才能增加变量

右。。。

setInterval想要的是一个可以调用的函数，

在第一种情况下，您将提供功能

在第二种情况下，您调用函数，然后返回其值

为了完成你在第二种情况下试图做的事情，你会这样做：

setInterval(function() {myFun(20)}, 1000}

它创建了一个新函数，将您对myFun的调用封装在其中…理解吗？

现在需要记住的另一件事是，setInterval会一直调用函数，直到你停止它……所以你可以这样做：

var counter = 20;
setInterval(function() {counter = counter-1; if (counter > 0) myFun()}, 1000)

它将每秒调用myFun，直到计数器过期。。。

但这仍然不是完美的a间隔将永远运行，所以你想要的是这样的东西（这是一个工作示例，点击底部的运行按钮）

    function nTimes(fn, count, time) {
      var interval = setInterval(function() {
        if (count > 0) {
          count = count - 1;
          fn(count);
        } else {
          clearInterval(interval);
        }
      }, time)
    };
    function myFun(x) {
      $('#output').html($('#output').html() + x + '</br>')
    }
    nTimes(myFun, 20, 1000)

<div id='output'></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

工作Fiddle：https://jsfiddle.net/0tesf2rk/

var counter = {
  value: 0,
  increase: function () {
    console.log(counter.value);
    counter.value++;
  }
};
counter.value = 20;
setInterval(counter.increase, 1000);

相关内容

最新更新

热门标签：