函数防抖与函数节流原理及使用-JobPlus

前言

在类似scroll、resize事件中执行大量DOM操作或者计算时，就会出现再次触发事件而上一次事件中的DOM操作和计算还没完成的情况，结果浏览器掉帧了，导致性能下降，影响用户体验。而函数节流和函数防抖，两者都是优化高频率执行js代码的一种手段。因此，可以用以下两种方式优化代码。

概念

一、函数防抖：
指频繁触发的情况下，只有足够的空闲时间，才执行代码一次，也就是让某个函数在上一次执行后, 满足等待某个时间内不再触发此函数后再执行, 而在这个等待时间内再次触发此函数, 等待时间会重新计算.实际需求多数为停止操作n毫秒后执行后续处理。
二、函数节流：
指为这个操作(函数)预先设定一个执行周期，当调用动作的时刻>=执行周期则执行该动作，然后进入下一个新周期,否则不执行。简单来说就是你的js方法在一定时间内只跑一次（频率）。