自己总结觉得重要的函数js中的防抖和节流

函数防抖：触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间。

函数节流：高频事件触发，但在n秒内只会执行一次，所以节流会稀释函数的执行频率。

函数节流与 函数防抖都是为了限制函数的执行频次，以优化函数触发频率过高导致的响应速度跟不上触发频率，出现延迟，假死或卡顿的现象。

// 防抖,考虑不能太快进入函数因此我们设置一个item 减少进入函数的次数减缓图像改变速度
        // 达到防抖的效果
        // 创见一个item
        var item=15;
        // 创建定时器
        setInterval(animation,16);
        function animation(){
            // 执行初始化函数
        init();
        }
        // 创建初始化函数
        function init(){
         
            // 每进入一次函数让item--
            item--;
            // 如果item大于0直接跳出函数
            if(item>0)return
            // 如果item小于0进入函数执行一次然后item重新赋值15
            item=15;
        
        }
// 节流
        // 创建布尔值bool为false
        var bool=false;
            // 根据选择器获取页面中的input
            var input=document.querySelector("input");
            // 给input设置input事件
            input.addEventListener("input",inputHandler);
            // 当输入框输入是执行该函数
        function inputHandler(e){
            // 如果布尔值为真时直接跳出函数
            if(bool)return
            // 如果bool为false时创建个定时器没500毫秒执行一次
            var ids=setInterval(function(){
                // 清除ids（定时器）
                clearInterval(ids);
                // // bool设置为false相当于设置了一个开关
                bool=false;
                // 打印input中内容
                console.log(input.value);
            },500)
            // 然后bool设置为true
            bool=true;
        }