参考文献：
防抖函数
概念：
触发高频事件后 n 秒内函数只会执行一次，如果 n 秒内高频事件再次被触发，则重新计算时间。
使用场景：
就像是我的搜索栏功能，是在里面内容变化后就实时触发搜索事件，但是有时候我们输的内容很长，在没有输完的时候就触发了事件，这样对性能来说是不好的，造成了很多无用的请求，这时候就需要用到防抖函数，来让其在搜索内容变化后的 200 毫秒内如果没有再更改才发起请求。
实现防抖函数的思路：
在高频触发事件的时候，取消原来的延时事件。
具体实现：
export function debounce(func, delay) {
let timer = null
return function (...args) {
if (timer) clearTimeout(timer)
timer = setTimeout(() => {
func.apply(this, args)
}, delay)
}
}
具体使用：
function sayHi() {
console.log('防抖成功');
}
var select = document.getElementById('myselect');
select.addEventListener('change', debounce(sayHi)); // 防抖
节流函数
概念：
高频事件触发，但在 n 秒内只会执行一次，所以节流会稀释函数的执行频率；
使用场景：
就像我接了一个任务，只能在 5 秒完成任务给回复，在执行后的这 5 秒内，你再怎么给我布置任务我都不管直接当没听到，直到到 5 秒后执行完这个任务，你才可以再次给我布置任务，以此类推。。。
实现思路：
每次触发事件时都判断当前是否有等待执行的延时函数，如果有直接截断事件不用往下执行了
具体实现：
function throttle(fn, interval) {
let canUse = true;
return function(...args) {
if (!canUse) return false;
canUse = false;
setTimeout((...args) => {
fn.apply(this, args);
canUse = true;
}, interval || 500);
}
}
具体使用：
function sayHi(e) {
console.log(e.target.innerWidth, e.target.innerHeight);
}
window.addEventListener('resize', throttle(sayHi));