代码重构技巧

代码重构

1. 提炼函数规则
   a. 避免出现超大函数
   b. 独立出来的函数有助于复用
   c. 独立出来的函数更容易被覆写
   c. 独立出来的函数命名规范

2. 合并重复的条件片段

   var paging = function(currPage){
       if( currPage <= 0){
           currPage = 0;
       }else if( currPage >= totalPage){
           currPage = totalPage;
       }
           jump( currPage);
    }  

3. 把条件分支提炼成函数

4. 合理使用循环

   var createXHR = function () {
        var versions = ['http.6.0','http.3.0','http.2.0'];
        for( var i = 0,version; version = versions[i++];){
              try{
                  return new ActiveXObject( version );
              }catch(e){}
          }
      }

5. 提前让函数退出嵌套条件分支

   • 嵌套分支对于函数维护无疑时噩梦般存在，当我们不需要执行剩余函数时，可以立即退出。

     var del = fuction( obj ){
     if( obj.isReadOnly ){
         return;
     }
     if( obj.isFolder ){
         return;
     }
     if( obj.isFile ){
         return;
     }
     }
     

6. 传递对象参数代替过长的参数列表
   
   • 函数参数过多难以理解，参数位置错位会导致函数无法正常执行，这时我们可以把参数放入对象中，然后把对象传入函数，这样不必关心参数的数量和顺序。
7. 尽量减少参数
8. 少用三目运算，增加代码阅读性
9. 合理使用链式调用
   
   • 链式调用不利用bug修改和维护

10. 分解大型类

    • 将Spirit类的攻击动作委托给Attact类的对象执行，避免Spirit类承担过多的责任；同理，Spirit类的防御可以委托给防御类

    var Attack = function (spirit) {
        this.spirit = spirit;
    }
    Attack.prototype.start = function (type) {
        return this.list[ type ].call(this)
    }
    Attack.prototype.list = {
        waveBoxing:function () {
            console.log(this.spirit.name+“使用波动拳”)
        },
        whirlkick:function () {
            console.log(this.spirit.name+“使用旋风踢”)
        }
    }
    var Spirit = function (name) {
        this.name = name;
        this.attackOjb = new Attack( this );
    }
    Spirit.prototype.attack = function (type) {
        this.attackOjb.start( type );
    }
    var spirit = new Spirit( 'dog' );
    spirit.attack( 'waveBoxing');
    spirit.attack( 'whirlKick'); 

11. 用return退出多重循环

    • 给循环设置标记mark,以及使用break的方式会增加代码的复杂度；我们可以直接用return直接退出整个循环方法，为了解决退出循环时，循环之后的一些代码不能执行的问题，可以采用return fn 的形式

    var func = function(){
       for( var i = 0;i < 10; i++){
           if( i > 5 ){
               return console.log( i );
           }
       }
    }

    以上代码均借鉴《JavaScript 设计模式与开放实践》