解密 setTimeout 与 setInterval 的内在联系与差异

2023-10-31 05:55:37

揭开 setTimeout 的神秘面纱

setTimeout 函数用于延迟执行一段代码，它接受两个参数：一个要执行的函数和一个延迟时间（以毫秒为单位）。当延迟时间到了，该函数就会被执行。

setTimeout(function() {
  // 这里是要执行的代码
}, 1000); // 延迟时间为 1000 毫秒

setTimeout 函数是一个非阻塞函数，这意味着它不会阻止脚本的执行。也就是说，当 setTimeout 函数被调用时，脚本会继续执行，而不会等待延迟时间结束。当延迟时间到了，该函数才会被执行。

setInterval 的魅力所在

setInterval 函数用于重复执行一段代码，它接受两个参数：一个要执行的函数和一个执行间隔（以毫秒为单位）。当执行间隔到了，该函数就会被执行，并且会一直重复执行，直到 clearInterval() 函数被调用。

setInterval(function() {
  // 这里是要执行的代码
}, 1000); // 执行间隔为 1000 毫秒

setInterval 函数也是一个非阻塞函数，这意味着它不会阻止脚本的执行。也就是说，当 setInterval 函数被调用时，脚本会继续执行，而不会等待执行间隔结束。当执行间隔到了，该函数才会被执行，并且会一直重复执行，直到 clearInterval() 函数被调用。

setTimeout 和 setInterval 的亲密关系

setTimeout 和 setInterval 函数都是基于 JavaScript 的事件循环来工作的。事件循环是一个不断循环的机制，它负责处理 JavaScript 中的事件和回调函数。当 setTimeout 或 setInterval 函数被调用时，它们会将一个回调函数添加到事件循环中。当延迟时间或执行间隔到了，该回调函数就会被执行。