JavaScript高级程序设计学习笔记-间歇调用（setInterval）和超时调用(setTimeout)

Javascript 是单线程语言，但它允许通过设置超时值和间歇时间值来调度代码在特定的时刻执行.

超时调用需要使用window对象的setTimeout()，第一个参数可以是一个字符串（就和在eval()中使用的字符串一样）也可以是一个函数。第二个参数是毫秒数，经过多长时间执行代码

<script>

    //不建议传递字符串

    setTimeout("alert('Hello world')", 1000);

    //推荐的调用方式

    //该方法会返回一个数值id，表示超时调用，是计划执行代码的唯一标识符，可以通过它来取消超时调用。

    //超时调用的代码是在全局作用域中执行的，因此函数的this在非严格模式下指向window对象，在严格模式下是undefined

    var timeoutId= setTimeout(function () {

        alert('hello world');

    }, 5000)

    //取消超时调用，只要在指定的时间尚未过去之前调用，就可以完全取消掉，结果跟什么都没发生一样。

    clearTimeout(timeoutId);

</script>

间歇调用setInterval()和超时调用类似，只不过它会按照指定的时间间隔来重复执行代码，直至间歇调用被取消或页面被卸载。

参数和超时调用的参数一样。

 

var num = 0;

    var max = 10;

    var intervalId = null;

    function incrementNumber() {

        num++;

        if (max == num) {

            //使用间歇调用id取消尚未执行的间歇调用

            clearInterval(intervalId);

            alert('done');

        }

    }

    //返回一个间歇调用id

intervalId = setInterval(incrementNumber, 500);

 

使用超时调用来模拟间歇调用（推荐）

<script>

    //使用超时调用来模拟间歇调用

    var num = 0;

    var max = 10;

    function incrementNumber() {

        num++;

        if (num < max) {

            setTimeout(incrementNumber, 500);

        } else {

            alert('done');

        }

    }

    //在使用超时调用时，没有必要跟踪超时调用Id，因为每次执行代码后，如果不在设置一次超时调用，调用就会自动停止。

    //一般认为，使用超时调用来模拟间歇调用的是一种最佳模式。

    //在开发环境中,很少使用真正的间歇调用，因为后一个间歇调用可能会在前一个间歇调用结束之前就启动了

    //使用超时调用可以完全避免这一点。

    setTimeout(incrementNumber, 500);

</script>