Question

我在stackoverflow中找到了这段代码，但我仍然问自己，计时器是如何自动自动启动的。

但是我注意到这个评论：

 //Optionally, activate each timer:
 //restart(i)();

将阻止计时器自动启动。

它可能是自动执行的功能，如果是。自动执行功能是否总是自动启动，即使在这种情况下按钮仍未被点击？

我还看到其他可能是函数内部自动执行的函数，有人可以解释这是怎么回事。

<!DOCTYPE html PUBLIC>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>


<script src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>

</head>

<body>


<input type="submit" name="clear" value="Stop Timer" />
<input type="submit" name="reset" value="Restart Timer" />
<span id="count0">0</span>
<input type="submit" name="increment" value="Increment" />
<br />
<input type="submit" name="clear" value="Stop Timer" />
<input type="submit" name="reset" value="Restart Timer" />
<span id="count1">0</span>
<input type="submit" name="increment" value="Increment" />

<br />
<input type="submit" name="clear" value="Stop Timer" />
<input type="submit" name="reset" value="Restart Timer" />
<span id="count2">0</span>
<input type="submit" name="increment" value="Increment" />

<br />
<input type="submit" name="clear" value="Stop Timer" />
<input type="submit" name="reset" value="Restart Timer" />
<span id="count3">0</span>
<input type="submit" name="increment" value="Increment" />

<br />
<input type="submit" name="clear" value="Stop Timer" />
<input type="submit" name="reset" value="Restart Timer" />
<span id="count4">0</span>
<input type="submit" name="increment" value="Increment" />

<script>




    (function(){ //Anonymous function, to not leak variables to the global scope
        var defaultSpeed = 3000; //Used when missing
        var timerSpeed = [500, 1000, 2000, 4000, 8000];

        var intervals = [];



        function increase(i){
            return function(){
                var elem = $("#count"+i);
                elem.text(parseInt(elem.text()) + 1);
            }
        }
        function clear(i){
            return function(){
                clearInterval(intervals[i]);
            }
        }
        function restart(i){ //Start AND restart
            return function(){
                clear(i)();
                increase(i)();
                intervals[i] = setInterval(increase(i), timerSpeed[i]||defaultSpeed);
            }
        }




        // Manual increment
        $('input[name=increment]').each(function(i){
            $(this).click(function(){
                restart(i)();
                increase(i)();
            });
        });

        // Clear timer on "Clear"
        $('input[name=clear]').each(function(i) {
            $(this).click(clear(i));
        });

        // Restart timer on "Restart"
        $('input[name=reset]').each(function(i) {
            $(this).click(restart(i));

            //Optionally, activate each timer:
            restart(i)();
        });


    })();






</script>
</body>
</html>

Answer 1

代码中只有一个自执行函数，它是代码顶部的包装函数（//匿名函数，不会将变量泄漏到全局范围内）。

自执行功能的格式可以为(function(parameters){})(arguments list);。

像restart这样的函数不是自动执行的函数，它们不会自动调用，而是手动调用它们。这些函数是返回另一个函数的函数，称为closure。

因此，如果你看一下restart(i)();语句，就会发生两件事。 1. restart(i)返回一个函数2.我们使用第二组括号调用该函数为了更好地了解我们可以将此声明分为两个部分

var fn = restart(i);
fn();

<强>更新由于以下代码，计时器自动启动

//Optionally, activate each timer:
restart(i)();

它将启动每个计时器

的启动

这个自动执行功能吗？如果是的话，它们如何运作？

1 个答案: