什么是节流，节流的使用？

1. 什么是节流

对于高频率反复触发的事件,将事件处理程序控制成低频率执行,节省资源,提升性能

注: 对于mousemove事件是不能控制事件触发的频率的,只能控制程序处理函数的执行次数

使用场景：鼠标移动mousemove,页面滚动scroll,页面尺寸改变resize 等默认会反复触发导致性能开发较大的事件

2. 需求：鼠标移动事件，鼠标移动时，每隔500ms就加 1 

    const text = document.querySelector('h1')
      let i = 0
      function mouseMove() {
        text.innerHTML = ++i
      }
      function throttle(fn, t) {
        // 事件的回调函数不能使用 fn() ? 不是,只要 fn 返回一个函数即可
        console.log('throttle 函数打开页面就会执行')
        let startTime = 0 // 开始时间
        return function () {
          console.log('这个返回的函数相当于回调函数,是鼠标移动时执行的')
          let now = Date.now() // 获取当前的时间戳
          if (now - startTime > t) {
            fn() // 调用 fn 即mouseMove()
            startTime = now //  每次调用回调函数 但是if条件不满足就不会执行 fn
          }
        }
      }
      window.addEventListener('mousemove', throttle(mouseMove, 500))