JS 定时器结合闭包实现-节流与防抖

防抖：

概念：用户连续点击，前面的触发都被取消，只有最后一次触发的回调在规定时间后才会触发。

即：如果连续触发 只会执行最后一次触发的回调。

使用场景：

百度搜索框中输入对应内容下方会有相关内容的提示，如果每输入一个文字都发送一次请求是非常浪费性能的，所以使用节流设置一个时间，只有当用户输入完内容之后不在输入，经过了预先设置好的时间才会发起请求。

// 防抖
// 概念：用户连续点击，前面的触发都被取消，只有最后一次触发的回调在规定时间后才会触发。
// 即 如果连续触发 只会执行最后一次触发的回调
// 绑定点击事件后，还要传入一个回调函数，所以通过返回一个函数，让绑定的事件去触发这个返回的函数
var btn = document.getElementById('input');
btn.addEventListener('click', debounce(submit));
function submit() {
    console.log(1);
}
function debounce(fn) {
    var t = null;
    return function () {
        if (t) {
            clearTimeout(t);   // 如果连续触发，则每次都会清除上一个定时器并重新开启一个定时器
        }
        t = setTimeout(function () {
            fn(e)
        }, 100