1、可維護(hù)性
- 可理解性坏瞄、
- 直觀性桂对、
- 可適應(yīng)性、
- 可擴(kuò)展性惦积、
- 可調(diào)式性
1.1 代碼約定:
1. 可讀性:
一般來說和代碼格式有關(guān)系
需要添加注釋的地方:
- 函數(shù)和方法:每個(gè)函數(shù)或者是方法都應(yīng)該包含一個(gè)注釋,描述其目的和用于完成任務(wù)所有可能使用的算法猛频,參數(shù)代表什么以及函數(shù)是否有返回值
- 大段代碼:用于完成單個(gè)任務(wù)的多行代碼應(yīng)該在前邊放一個(gè)描述任務(wù)的注釋
- 復(fù)雜的算法:如果使用一種獨(dú)特的方式解決莫個(gè)問題狮崩,要注意注釋中解釋你是如何做的
- Hack :
2 變量和函數(shù)命名:
- 變量名為名詞:car person
- 函數(shù)名以動(dòng)詞開頭: getName 返回boolean的函數(shù)以is開頭
- 變量函數(shù)都要合乎邏輯,不要擔(dān)心長度
3 變量類型透明
第一種方式是:初始化鹿寻;
var found = false;
第二種方法是匈牙利標(biāo)記發(fā)來指定變量類型睦柴。匈牙利在變量名之前加一個(gè)或多個(gè)字符來表示數(shù)據(jù)類型。
var bFound;//boolean
var iCount;//int
第三種 類型注釋:
var found /:Boolean/ = false;
1.2 松散耦合
只要某個(gè)部分的代碼過于依賴另一個(gè)部分毡熏,代碼就是耦合過緊坦敌,難于維護(hù)
對(duì)象直接引用另一個(gè)對(duì)象,并且當(dāng)修改其中一個(gè)的同時(shí)痢法,需要修改另外一個(gè)狱窘,緊密的耦合的軟件難于維護(hù)需要經(jīng)常重寫
1、解耦html/javascript
分開來寫
2财搁、解耦css/javascript
js改變class而不改變style
3蘸炸、解耦應(yīng)用邏輯/事件處理程序
以下是一些混合在一起的方法
function handleKeyPress(event) {
event = EventUtil.getEvent(event);
if(event.keyCode ==13){
var target = EventUtil.getTarget(event);
var value = 5*parseFloat(target.value);
if(value>10){
document.getElementById("error-msg").style.display = "block";
}
}
}
然后把業(yè)務(wù)和事件拆分開看看
function handleKeyPress(event) {
event = EventUtil.getEvent(event);
if(event.keyCode ==13){
var target = EventUtil.getTarget(event);
validateValue(target.value)
}
}
function validateValue(value) {
value = 5*value;
if(value>10){
document.getElementById("error-msg").style.display = "block";
}
}
以下是松散耦合的原則:
- event對(duì)象不當(dāng)成參數(shù)傳
- 任何可以在因用戶層面的動(dòng)作都應(yīng)該可以在不執(zhí)行任何時(shí)間處理程序的情況下進(jìn)行
- 任何事件處理程序都應(yīng)該處理事件,然后將處理轉(zhuǎn)交給應(yīng)用邏輯
1.3 實(shí)戰(zhàn):
1尖奔、尊重對(duì)象所擁有權(quán)
2搭儒、避免全局量
3、避免與null進(jìn)行比較提茁,如果遇到一個(gè)與null比較的代碼淹禾,嘗試一下的技術(shù):
如果值應(yīng)該為一個(gè)引用類型,用instanceof
如果值應(yīng)該是一個(gè)基本類型茴扁,用typeof檢測(cè)其類型
如果是希望對(duì)象包含摸個(gè)特定的方法名铃岔,typeo操作符確保指定名字存在于對(duì)象上
4、使用常量
將數(shù)據(jù)和使用它的邏輯進(jìn)行分離峭火,
1德撬、重復(fù)值 任何再多出用到的值铲咨,都應(yīng)該抽取為一個(gè)常量。
2蜓洪、用戶界面字符串--任何用于顯示給用戶的字符串纤勒,都硬掰抽取出來以方便國際化
3、URLs-- 資源位置容易變隆檀,所以需要公共地方存放
4摇天、任意可能會(huì)改變的值
2、性能
2.1 注意作用域
只要能減少作用域鏈上消耗的時(shí)間恐仑,就能增加腳本的整體性能
1泉坐、避免全局查找:比如頻繁的調(diào)用document
2、避免with語句裳仆,with會(huì)創(chuàng)建自己的作用域腕让。從而增加了其中執(zhí)行的代碼的作用域鏈的長度。
2.2 選擇正確的方法:
1歧斟、 避免不必要的屬性查找
注意:
數(shù)組的復(fù)雜度是O(1)而對(duì)象的空間復(fù)雜度是O(n);
所以一旦多次遇到對(duì)象的屬性,應(yīng)該將他們存放在局部變量中静袖。
盡可能多的使用局部變量將睡醒查找替換為值查找
2觉鼻、優(yōu)化迭代
- for循環(huán)從大到小
- 簡(jiǎn)化終止條件
- 簡(jiǎn)化循環(huán)體
- 使用后測(cè)試循環(huán),for while是前測(cè)試循環(huán)do-while是后測(cè)試循環(huán)队橙,避免了終止的計(jì)算
3坠陈、展開循環(huán)
循環(huán)次數(shù)確定時(shí)候,消除循環(huán)捐康,多次函數(shù)調(diào)用仇矾,往往更快,
4解总、避免出現(xiàn)雙重解釋
eval("alert('')");
new Function();
setTimeOut("",300);
5若未、性能的其他注意項(xiàng):
原生的方法比較快:Math.各種方法比手寫的算法快,因?yàn)閖s默認(rèn)的方法是c/c++直接編譯的
switch語句比ifelse快
位運(yùn)算比任何布爾運(yùn)算或者算術(shù)運(yùn)算快
2.3最小化語句數(shù):
1倾鲫、多個(gè)變量申明粗合,
var a=1,b=2,c=3這種
2、插入迭代值
一個(gè)語句完成兩個(gè)語句的事情時(shí)候乌昔,用i++嵌套到語句中
3隙疚、使用數(shù)組和對(duì)象字面量
2.4優(yōu)化DOM交互
最小化現(xiàn)場(chǎng)更新,使用innerHTML磕道,使用時(shí)間代理供屉,注意HTMLCollection的使用