js定时器的几种写法

setTimeout（）

设定一个定时器，在指定时间后执行一段代码。

let timeoutId = setTimeout(func,delay,param1,param2,……);

timeoutId：为此定时器的id，此id可以传入clearTimeout（）来取消这次定时器

func：为指定时间后执行的函数

delay：是延迟的毫秒数。

如果省略的话，默认取值0。

param：向延迟函数传递而外的参数，IE9以上支持

this问题

由于setTimeout()调用的代码运行在与所在函数完全分离的执行环境上. 这会导致,这些代码中包含的 this 关键字会指向 window (或全局)对象,这和所期望的this的值是不一样的.

解决方案：使用bind（）来绑定当时所处环境的this

最小延迟

当设置的delay时间小于浏览器的最小延迟时间时，浏览器就会强制使用最小延迟时间。这个最小延迟时间一般为4ms。

setInterval（）

以给定的时间间隔重复执行一个函数。

var intervalID = window.setInterval(func, delay[, param1, param2, ...]);

这里的参数的含义与setTimeout相同。

可以使用setTimeout来完成setInterval的工作，这样做的好处是，setTimeout保证了每次执行完当前函数中的操作再进行下一次定时任务，而setInterval不会保证上一次任务执行完毕再添加下一次任务。

setImmediate（）

该方法用来把一些需要长时间运行的操作放在一个回调函数里,在浏览器完成后面的其他语句后,就立刻执行这个回调函数。类似setTimeout(func, 0)

var immediateID = setImmediate(func, [param1, param2, ...]);

immediateID 是这次setImmediate方法设置的唯一ID,可以作为 clearImmediate 的参数.

func 是将要执行的回调函数

该方法可以用来替代 setTimeout(0) 方法来滞后完成一些需要占用大量cpu时间的操作.下面的JavaScript可以用来兼容那些不支持setImmediate方法的浏览器:

if (!window.setImmediate) {
window.setImmediate = function(func, args){
return window.setTimeout(func, 0, args);
};
window.clearImmediate = window.clearTimeout;
}

requestAnimationFrame

专门为实现高性能的帧动画而设计的API，但是不能指定延迟时间，而是根据浏览器的刷新频率而定（帧）.

如果你想做逐帧动画的时候，你应该用这个方法。这就要求你的动画函数执行会先于浏览器重绘动作。

通常来说，被调用的频率是每秒60次，但是一般会遵循W3C标准规定的频率。

var requestId = window.requestAnimationFrame(func);