关于防抖和节流的问题

108 阅读1分钟

概念

正常:事件触发非常频繁,而且每一次的触发,回调函数都要去执行(如果时间很短,而回调函数内部有计算,那么很可能出现浏览器卡顿)

防抖:前面的所有的触发都被取消,最后一次执行在规定的时间之后才会触发,也就是说如果连续快速的触发,只会执行最后一次

节流:在规定的间隔时间范围内不会重复触发回调,只有大于这个时间间隔才会触发回调,把频繁触发变为少量触发

我们在项目中不需要单独的下载lodash,因为很多包都有这个依赖,lodash就包含了防抖和节流函数

//节流
import throttle from 'lodash/throttle'
changeIndex: throttle(function (index) {
      this.currentIndex = index
    }, 50),
防抖
import debounce from 'lodash/debounce'
changeIndex: debounce(function (index) {
      this.currentIndex = index
    }, 50),