JavaScript代碼優化

 轉貼自：http://www.wxwdesign.cn/article/skills/javascript_code_optimization.htm

高級程序設計提供的發布JavaScript代碼時的優化建議，總結一下：



一、字節數優化

1. 刪除註釋(版權及法律聲明部分應保留)

2. 刪除製表符和空格

3. 刪除所有換行

4. 替換變量名

示 例：
function show(name,age){alert(name+","+age);}

優化：
function s(n,a){alert(n+","+a);}

5. 其它減少字節數的方法

5.1 替換布爾值  用0和1替代false和true

5.2 縮短否定     用!a代替a!=b

5.3 使用字面量  用[]代替new Array(),用{}代替new Object()

不過以上優化都可以通過軟件實現，目前很有多壓縮工具。


二、執行效率優化

根 據測試數據：Javascript比編譯型的C慢5000倍，比解釋型的Java慢100倍，比解釋型的Perl慢10倍。

1. 關注範圍(儘可能減少函數的多級調用)

示例：
function a(){}
function b(){a();}
function c(){b();}
c();   //增加了函數引用的複雜性，同時也影響執行效率

2. 儘可能使用局部變量

3. 避免with語句

4. 選擇正確的算法

5. 反轉循環

示 例：
for(var i=0;i<inputs.length;i++){ }

優化：
for(var i=inputs.length;i>=0;i--){}   //緩存了inputs.length數據

for(var i=0,len=inputs.length;i<len;i++){}  //這樣也是可以的

6. 翻轉循環

示例：
var i=0; while(i<inputs.length){ ... i++;}

優化：
var i=0; do{... i++;}while(i<inputs.length);

再次優化：
var i=inputs.length-1; do{...}while(--i>=0);

7. 展開循環

示 例：
var a=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15],sum=0;
for(var i=0,len=a.length;i<len;i++){sum+=a[i];}

優化：
var a=[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15],sum=0;
for(var i=0,len=a.length;i<len;i++){
sum+=a[i++];
sum+=a[i++];
sum+=a[i++];
sum+=a[i++];
}   //這樣只需要循環3次，比上面的for少了12次循環

8. 優化if()

示 例：
if(a){}else if(b){}else if(c){}else{}  //其中c的可能性最大

優化：
if(c){}else if(a){}else if(b){}else{}  //把可能性最大的放前面，以減少判斷次數

9. 避免使用+連接字符(IE6和IE7效率比較低)，用Array.join()替代

10. 優先使用內置方法

比如：Math.power(a,b); //計算a的b次冪，內置方法效率要高一些

11.  存儲常用值

示 例代碼：
var a=document.getElementsByTagName("input");
var len=a.length;   //多次使用時，把a.length存儲到變量len裡

12. 一行定義多個變量

示例代碼：
var a,b,c,d=0,s="",arr=[],obj={};

13. 插入迭代子

示例代碼：
sum+=a[i];
i++;

優化：
sum+=a[i++];

14. 使用對象字面量

示例：
var tom=new Object();
tom.name="tom";
tom.age=16;

優化：
var tom={name:"tom",age:16};

15. 節約使用DOM(避免頻繁更改DOM樹)

使用文檔片段 (document.createDocumentFragment())緩存過程中的DOM元素。