Javascript setTimeOut如何使用调整大小事件侦听器？

从Mozilla上的

resize

，我不理解下面的示例，即

resizeTimeout

如何在

setTimeout

函数中设置为

null

。这有什么作用？通过声明

var resizeTimeout

然后将其设置为

null

，则

（！resizeTimeout）

的条件将为true，那么将其设置为

null

又有什么区别呢

(function() {

  window.addEventListener("resize", resizeThrottler, false);

  var resizeTimeout;
  function resizeThrottler() {
    // ignore resize events as long as an actualResizeHandler execution is in the queue
    if ( !resizeTimeout ) {
      resizeTimeout = setTimeout(function() {
        resizeTimeout = null;
        actualResizeHandler();

       // The actualResizeHandler will execute at a rate of 15fps
       }, 66);
    }
  }

  function actualResizeHandler() {
    // handle the resize event
    ...
  }

}());

---

正如函数名所示，这是一种称为“节流”的常见技术。这使得调整大小处理程序最多每66毫秒调用一次

如果用户正在调整窗口大小，它将持续触发该事件并不断触发resizeThrottler功能。但是，如果每次触发调整大小事件时都执行actualResizeHandler，则页面将陷入困境

---

由于resizeTimeout在超时函数中被设置为null，因此表达式

！resizeTimeout

最多每66毫秒才为真。一旦这66毫秒结束，您可以设置另一个。

正如函数名所示，这是一种称为“节流”的常用技术。这使得调整大小处理程序最多每66毫秒调用一次

如果用户正在调整窗口大小，它将持续触发该事件并不断触发resizeThrottler功能。但是，如果每次触发调整大小事件时都执行actualResizeHandler，则页面将陷入困境

---

由于resizeTimeout在超时函数中被设置为null，因此表达式

！resizeTimeout

最多每66毫秒才为真。一旦这66毫秒结束，您可以设置另一个。

其效果是，

resizeTimeout

以null开始，在第一次调整大小事件之后，它会获得一个值并启动一个计时器，当它具有该值时，任何未来的调整大小事件都会被忽略。然后，当计时器完成时，调用“实际”处理程序，并且

resizeTimeout

返回null，因此下一个调整大小事件将再次启动计时器。其效果是

resizeTimeout

以null开始，在第一个调整大小事件之后，它获得一个值并启动计时器，并且当它具有该值时，将忽略任何将来的调整大小事件。然后，当计时器完成时，调用“实际”处理程序，并且

resizeTimeout

返回null，因此下一个调整大小事件将再次启动计时器。