JS可维护性代码

最近在看一本Js的书名叫“Javascript高级程序设计”在里面学到了很多东西,是一本不错的书,非常值得一看。

解耦css/javascript

element.style.color="red";

element.style.backgroundColor="blue";

以上方式css和javascript的太过于紧密;我们应写成:

element.className="edit";

css样式和js代码完全分离。

再次优化:

var cssName={

    css1:"edit",

}

element.className=cssName.css1;

2.解耦应用逻辑/事件处理程序

function handlekeyPress(event){

    event=EventUtil.getEvent(event);

    if(event.keyCode==13){

       var target=EventUtil.getTarget(event);

       var value=5*parentInt(target.value);

       if(value>10){

          document.getElement("error-msg").style.display="block";

      }

    }

};

写成:

function validateValue(value){

   value=5*parseInt(value);

   if(value>10){

      document.getElement("error-msg").style.display="block";

   }

};

function handleKeyPress(event){

    event=EventUtil.getEvent(event);

    if(event.keyCode==13){

        var target=EventUtil.getTarget(event);      

     }

};

 

3.避免全局量:

var name="Ncihoals"

function sayName(){

}

写成:

var MyApplication={

   name:"Nicholas",

   sayName:function(){

   }

}

Js命名空间的概念:

//创建全局对象

var Wrox={};

//创建命名空间:

Wrox.ProJs={};

将所用的变量的都附加到Wrox上

Wrox.ProJs.EventUtil={};

这样做的最主要目的是为了在同一页面中能与其它的js文件共存,不会出现重名的情况。

 

3.避免与null进行比较:

function sortArry(values){

   if(values!=null){   //避免

        values.sort(comparator);

    }

}

function sortArry(values){

    if(values instanceof Arry){ //推荐

        values.sort(comparator);

    }

}

posted @   joinOne  阅读(311)  评论(0编辑  收藏  举报
努力加载评论中...
点击右上角即可分享
微信分享提示