闭包与高阶函数学习

1、bind方法实现

Function.prototype.bind = function(){
            var self = this,
            context = [].shift.call(arguments);
            args = [].slice.call(arguments);
            return function(){
                return self.apply(context,[].concat.call(args,[].slice.call(arguments)));
            }
        }

        var obj = {
          name:'aaa'
        }

        var func = function(a,b,c,d){
          console.log([a,b,c,d]);
        }.bind(obj,1,2);

        console.log(func(3,4));

2、mult 缓存函数

var mult = (function(){
            var cache = {};
            var calcuate = function(){
                var a = 1;
                for(var i=0;i<arguments.length;i++){
                    a = a*arguments[i];
                }
                return a;
            }
            return function(){
                var args = Array.prototype.join.call(arguments,',');
                if(cache[args]){
                    return cache[args];
                }
                return cache[args] = calcuate.apply(null,arguments);
            }
        })();

        console.log(mult(2,3,4,5));
        console.log(mult(2,3,4,5));

3、函数currying

var cost = (function(){
        var args = [];
        return function(){
            if(arguments.length === 0){
                var m = 0;
                for(var i=0,l=args.length; i<l; i++){
                    m += args[i];
                    
                }
                return m;
            }else{
                [].push.apply(args,arguments);
            }
        }
    })();

    cost(100);
    cost(200);
    cost(300);
    console.log(cost());

4、分时函数

var timechuck = function(ary,fn,count){
        var obj,
            t;
        var  len = ary.length;
        var start = function(){
            console.log(ary.length)
            for(var i=0; i<Math.min(count||1,ary.length);i++){
                var obj = ary.shift();
                fn(obj);
            }
        }
        return function(){
            t = setInterval(function(){
                if(ary.length === 0){
                    return clearInterval(t);
                }
                start();
            },200)
        }

    }

    var ary = [];
    for(var i=1;i<=100;i++){
        ary.push(i);
    }

    var renderList = timechuck(ary,function(n){
        var div = document.createElement("div");
        div.innerHTML = n;
        document.body.appendChild(div);

    },8)
    renderList();

5、节流函数

var throttle = function(fn,interval){
     var _self = fn,
         timer,
         firstTimer=true;
     return function(){
         var me =this,
             args = arguments;
         if(firstTimer){
             _self.apply(me,args);
             firstTimer = false;
         }
         if(timer){
             return false;
         }

         timer = setInterval(function(){
             clearInterval(timer);
             timer = null;
             _self.apply(me.args);

         },interval||500)

     }

 }


 
 window.onresize = throttle(function(){
     console.log(111);
 },2000)

7、惰性载入事件

//惰性载入事件
    var addEvent = function(elem,type,handler){
        if(window.addEventListener){
                addEvent = function(elem,type,handler){
                    elem.addEventListener(type,handler,false);
                }
            }else if(window.attachEvent){
                addEvent = function(elem,type,handler){
                    elem.attachEvent("on"+type,handler);
                }
            }
        addEvent(elem,type,handler);
    };

    var t = document.getElementById("test");
    addEvent(t,"click",function(){
        alert(1);
    })
原文地址:https://www.cnblogs.com/junwu/p/5254274.html