javascript之高级函数应用思想

1.级联函数:应用对象方法调用的连写

function A(){                                      
     this.a = '';
     this.b = '';
     this.c = '';
}                                              //改造一下
A.prototype = {                                A.prototype = {
     setA :  function(){                             setA :  function(){
          this.a = 'A';                                  this.a = 'A';
     },                                                  return this;
     setB :  function(){                             },
          this.b = 'B';                              setB :  function(){   
     },                                                   this.b = 'B';
     setC :  function(){                                  return this;
          this.c = 'c';                              }, 
     }                                               setC :  function(){    
}                                                         this.c = 'c'; 
var x = new A();                                          return this;
x.setA();                                            }
x.setB();                                     } 
x.setC();                                     x.setA().setB().setC();  

2.惰性载入:性能优化

   我们先看个案例

function addEvent(type, element, func){
    if(element.addEventListener){
        element.addEventListener(type, func, false);
    }else if(element.attachEvent){
        element.attachEvent('on'+type, func);
    }else{
        element['on'+type] = func;
    }
}

    每次调用addEvent函数的时候,它都要对浏览器事件机制进行检查,从第一个 if 开始判断,无端地浪费了内存,javasript提出了 惰性载入函数思想,第一次判断出浏览器能力,之后就不再判断了,好啦,脱衣解裤,我们开始吧......

   方式一:函数重写方式

/**
 * 分析:
 *    在这个惰性载入的addEvent()中,if语句的每个分支都会为addEvent变量赋值,有效覆盖了原函数。
 *    最后一步便是调用了新赋函数。下一次调用addEvent()的时候,
 *    便会直接调用新赋值的函数,这样就不用再执行if语句了
 */
function addEvent(type, element, func){
    if(element.addEventListener){
        //惰性载入重写addEvent()
        addEvent = function(type, element, func){
            element.addEventListener(type, func, false);
        };
    }else if(element.attachEvent){
        addEvent = function(type, element, func){
            element.attachEvent('on'+type, func);
        };
        
    }else{
        addEvent = function(type, element, func){
            element['on'+type] = func;
        };
    }
    return addEvent(type, element, func);
}

     方式二: 匿名函数立即调用方式

/**
* 分析:
*     创建一个匿名的自执行函数,通过不同的分支以确定应该使用那个函数实现,
*     每个分支都返回一个正确的函数,并立即将其赋值给变量addEvent
*     之后每次调用都是这个被赋的值
*/
var addEvent = (function(){
    if(document.addEventListener){
        return function(type, element, func){
            element.addEventListener(type, func, false);
        };
    }else if(document.attachEvent){
        return function(type, element, func){
            element.attachEvent('on'+type, func);
        };        
    }else{
        return function(type, element, func){
            element['on'+type] = func;
        };
    }    
})();

怎么样,是不是有点小高潮,反正我是湿了......

     3.函数柯里化: 这里就不讲解了,感觉没JB用,

posted on 2016-07-29 14:15  爱疯的小疯子  阅读(159)  评论(0编辑  收藏  举报

导航