JS高阶函数

1.纯函数

函数在有相同的输入时，会有相同的输出  函数的输出和当前运行的函数执行上下文无关

（不影响运行环境，无副作用）

2.防抖

短时间内多次触发事件只执行一次（最开始的一次或最后一次的触发）

防抖的封装  ↓

<input type="text">
<script>

var ipt=document.getElemengtsByTagName('input')[0];
ipt.oninput=dobounce(1000,test);
function debounce(time,hanlder){
    var timer=null;
    return function(){
        clearTimeout(timer);
        var self=this;
        timer=setTimeout(function(){
            hanlder();
        },time)

    }
}
function test(){
console.log(ipt.value)

}

</script>

3.节流

函数在大于等于某一个周期时间才执行，在周期内不执行

防抖的封装  ↓

 <div>0</div>
   <button>点我</button>
   <script>
       var btn=document.getElementsByTagName('button')[0];
       var div=document.getElementsByTagName('div')[0]
       //节流处理
       btn.onclick=thorttle(1000,test)
       function test(){
           //让div的内容进行累加
           div.innerHTML=Number(div.innerHTML)+1
       }

       function thorttle(time,hanlder){
            var lastTime=0;
            //记录每一次点击时间，判断两次点击之间的间隔时间 >=1000ms
            return function(){
                var nowTime=new Data().getTime();
                if(nowTime-lastTime>=time){
                    //让div的内容+1
                    //让btn的点击事件在一秒内  只能执行一次
                    hanlder();
                    lastTime=nowTime;
                }
            }
       }
   </script>

4.柯里化

将接受多个参数的函数进行处理，转换成一次只接受一个参数的函数

作用：简化代码，提升代码的复用性

柯里化的函数   ↓

 <script>
        function add(a,b,c){
            return a+b+c
        }
        //封装一个柯里化函数
        function curry(fu){
            return function curryFn(){
                //1.一次性将所有参数传完
                if(arguments.length<fn.length){
                    //2.没有一次性传完
                    var _arg=Array.from(arguments);
                    return function(){
                        //当这个匿名函数被调用时
                        //看这一传递进来的参数+上一次的参数===fn.length
                        return curryFn(...Array.from(arguments).concat(_arg))
                    }
                }
                return fn(...arguments)
            }
        }
        var curryFn=curry(add)
        console.log(curryFn(1,2,3))