JS-定时器

• 定时器分为两种
• 延时定时器（爆炸定时器）
  • 语法：setTimeout(函数, 毫秒数)
  • 当setTimeout执行，开启定时器后，经过传入的毫秒数后则执行一次传入的函数
• 间隔定时器
  • 语法：setInterval(函数, 毫秒数)
  • 当setInterval执行，开启定时器后，每经过传入的毫秒数后则执行一次传入的函数

注意：定时器中传入的函数是异步代码

• 定时器的返回值
  • 两种定时器的返回值都一样
    • 返回一个数值，表示页面中开启的第几个定时器
    • 定时器的返回值也就是这个定时器的标识
  • 作用：用于关闭定时器使用
• 关闭定时器
  • 语法1：clearInterval(定时器标识)
  • 语法2：clearTimeout(定时器标识)
  • 注意：每一种语法都可以关闭两种定时器，只要传入对应的定时器标识

// 开启setTimeout延时定时器
var timerId1 = setTimeout(function () {
    console.log('延时定时器触发了');
}, 1000);

// 开启setInterval间隔定时器
var timeId2 = setInterval(function () {
    console.log('间隔定时器触发了');
}, 1000);

// 给document（页面的文档）绑定一个点击事件
document.onclick = function () {
    // 关闭定时器
    // clearInterval(timerId1);
    // clearInterval(timerId2);
    clearTimeout(timerId1);
    clearTimeout(timerId2);
}

• setTimeout/setInterval的第三个参数开始，就是给传入的函数执行时传递的实参值

setTimeout(function(a, b, c) {
    console.log(a, b, c); // 10 20 30
}, 1000, 10, 20, 30);

定时器时间计算的精确度，取决于浏览器运行环境