setTimeout()和setInterval()

setTimeout()

定义和用法

setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式(字符串)。它会返回一个整数，表示定时器的编号，这个值可以传递给clearTimeout()用于取消这个函数的执行

语法

setTimeout(code,millisec)

参数	必选	说明
code	true	要调用的函数后要执行的 Js 代码串(function|String)
millisec	true	在执行代码前需等待的时间，单位为毫秒

示例
code可以是方法也可以是字符串

code is function

var timeout = setTimeout(function() {
    console.log('this is a timeout')
}, 1000);
// this is a timeout

以上代码在1秒后，控制台会打印出this is a timeout

code is String

var timeout = setTimeout(
    'console.log("this is a timeout")'
, 1000);
console.log("this is for test")

// this is for test
// this is a timeout

此时第一个参数为字符串，setTimeout()会将字符串解析成js代码，然后在1秒后将内容输出到控制台，当字符串无法解析时，控制台报错。另外这种方式，会造成javascript引擎进行两次解析，降低性能，甚至有可能造成内存泄漏，不建议使用。

millisec

第二个参数，是毫秒数，是code延迟执行的时间。1000ms也就是1s，也就是上面例子，先打出this is for test，过一秒才打印出this is a timeout的原因。
但是如果我将上面的1000设置成0呢，按理说，就应该先执行定时任务。后打印"this is for test"。但事实仍然是，按照上面的顺序打印内容。这里就涉及到了js引擎的执行机制，回头会讲。

setTimeout 的返回值
setTimeout的返回值用于取消定时任务，所以要保证每个setTimeout的返回值都是唯一的

var timeout = setTimeout(function() {
    console.log('this is a timeout')
}, 1000);

console.log(timeout, typeof timeout);
var timeout1 = setTimeout(function() {
    console.log(timeout1, typeof timeout)
}, 1000);
var timeout2 = setTimeout(function() {
    console.log(timeout2, typeof timeout)
}, 1000);

// 1, "number"
// this is a timeout
// 2, "number"
// 3, "number"

从以上代码就可以知道、每一个 setTimeout()的返回值类型都为数值型，但是值不同，保证其唯一性。

结束一个 setTimeout 的执行
在实际的项目中，在其回调函数未执行之前，满足某些条件可能需要阻止该该回调的执行，就需要取消定时器。操作就是clearTimeout( timeout );

var timeout = setTimeout(function() {
    console.log('this is a timeout')
}, 1000);

clearTimeout(timeout);

根据上面的操作，知道这个timeout的值为1，所以直接执行clearTimeout( 1 )也能够取消这个定时器的执行

关于setTimeout的隐患
内存泄漏：内存泄漏（Memory Leak）是指程序中己动态分配的堆内存由于某种原因程序未释放或无法释放，造成系统内存的浪费，导致程序运行速度减慢甚至系统崩溃等严重后果。
setTimeout当第一个参数为字符串的时候，就会有内存泄漏。

setTimeout(function test1() {
    var a = 1;
    console.log(a);
}, 0)

setTimeout((function test2() {
    var b = 1;
    console.log(b);
}).toString(), 0)

执行代码后，打开控制台，分别输入函数名test1和test2

test1
// Uncaught ReferenceError: test1 is not defined

test2
// ... (打印出 test2 的函数体)

会发现，当第一个参数为函数时，回调函数执行完毕后，test1函数被销毁，其所使用内存也被释放；当第一个参数为字符串时，test2却始终存在，它没有被销毁，始终占据着内存，也就造成了内存泄漏所以让我们需要使用 setTimeout时，一定要注意，第一个参数必须传入一个函数

setInterval()

定义和用法

setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。该方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数，ID值唯一。

语法

setInterval(code,millisec[,"lang"])

参数	必选	说明
code	true	要调用的函数或要执行的代码串
millisec	true	周期性执行或调用 code 之间的时间间隔，单位为毫秒

返回值
setInterval()方法返回的，用于取消对 code 的周期性执行的值。

区别

从上面定义可知。

setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式，且setTimeout()只会执行一次。 所以setTimeout() 方法更像一个延时器，到时间就会执行。

setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。也就是每隔一段时间执行一次，这个时间就是后面我们设置的millisec，这样子看就是一个定时器。setInterval() 方法在执行的时候，会返回一个ID值，用于clearInterval(ID值)取消循环操作。

setInterval()方法在使用的时候有几个注意事项。

• setInterval() 无视代码错误、对自己调用的代码是否报错漠不关心。即使调用的代码报错了，它依然会持续的调用下去
• setInterval() 无视网络延迟。假设你每隔一段时间就通过Ajax轮询一次服务器。某些原因（服务器过载、临时断网、流量剧增、用户带宽受限，等等），你的请求要花的时间远比你想象的要长。但setInterval不在乎。它仍然会按定时持续不断地触发请求，最终你的客户端网络队列会塞满Ajax调用。
• setInterval不保证执行。与setTimeout不同，你并不能保证到了时间间隔，代码就准能执行。如果你调用的函数需要花很长时间才能完成，那某些调用会被直接忽略。

setTimeout()也可以通过调用自己，实现setInterval()的效果 所以setInterval()能不用尽量不用。