JS函数防抖和函数节流及其使用场景。

函数防抖：

    防抖函数进入页面   滚动条事件调用函数debounce  有两个实参对应他的形参 如果不设置第二个实参 有默认参数

    然后设置定时器，给与滚动条下拉一个计时器让其500毫秒后运行，然后在运行过程中继续滑动滚动条继续调用，停止的时候清楚定时器。

// 防抖函数
    function debounce(callback,time = 300){   //形参 和  默认参数
        let t;
        return function(){
            clearTimeout(t);
            t = setTimeout(callback,time);
        }
    }

    //  绑定滚动条事件 
    window.onscroll = debounce(function(){
        console.log("调用了1次");    //  实参
    },500)      // 实参

使用场景：

【永远在执行最后一次】  回到顶部 立即（实时）搜索

用户在不停的改变浏览器的浏览位置，滚动条在不停 滑动，滚动条事件就一直触发，使用防抖后让其只触发最后一次，大大节约了请求资源

函数节流：

规定在一个单位时间内，只能触发一次函数。

如果这个单位时间内触发多次函数，只有一次生效。通俗来讲，就是在now毫秒的时间内，函数只会触发一次。两次触发时间的间隔一定大于now毫秒。

 function throlle(callback,time = 300){
        // 进入页面给一个时间戳
        let lasttime = new Date().getTime();
        return function(){
            // 给下滑后一个时间戳
            let now = new Date().getTime();
            // 如果第二次减去第一次的时间戳小于这个时间
            if(now - lasttime > time){
                // 执行函数callback
                callback();
                // 执行完后让第二次的时间戳赋给第一次，这样依次减下去
                lasttime = now;
            }
        }
    }
window.onscroll = throlle(function(){
        console.log("调用了一次");
    },500);

使用场景：

所有的数据请求【按钮】  下拉刷新

鼠标不断点击触发(单位时间内只触发一次)
监听滚动事件，比如是否滑到底部自动加载更多，用now来判断