一、簡化代碼

　　采用更為簡短的寫法，不僅可以減少輸入的字符數，還可以減少文件大小。大部分采用簡單寫法的代碼，執行效率都有輕微提高。

　　1.1 簡化常用對象定義：

　　使用 var obj = {}; 代替 var obj = new Object();

　　使用 var arr = []; 代替 var arr = new Array();

　　1.2 精簡if語句

　　三元操作符可以有效精簡只涉及賦值傳值操作的if語句，比如

　　var score = 60, grade;

　　if (score < 60) {

　　grade = “不及格”;

　　} else {

　　grade = “及格”;

　　}

　　可以精簡為：

　　var score = 60;

　　var grade = score < 60 ? “不及格” : “及格”;

　　三元操作符也支持嵌套，但是嵌套的層次太多會影響程序的可讀性，這方面要多加斟酌。

　　1.3 使用JSON

　　JSON是一種輕量級的數據格式，輕量級首先體現在它的結構定義非常簡單。

　　var obj = {};

　　obj.p1 = ‘a’;

　　obj.p2 = ‘b’;

　　obj.p3 = ‘c’;

　　可精簡為：

　　var obj = {

　　p1 : ‘a’,

　　p2 : ‘b’,

　　p3 : ‘c’

　　};

　　二、使用高效率的代碼

　　網上流傳的效率優化文章非常多，一些比較專業的Javascript書籍也談到了不少，因此，這里就只列出一些很少談到的。

　　2.1 精簡循環體

　　循環的效率很大程度上是由循環體決定的，與之相比，用for還是while的差別就太小了。考慮如下的代碼，其功能是為某一批元素添加事件：

　　function addEvent(elems, eventName, handler) {

　　for (var i = 0, len = elems.length; i < len; i++) {

　　if (window.attachEvent) {

　　elems[i].attachEvent(”on” + eventName, handler);

　　} else if (window.addEventListener) {

　　elems[i].addEventListener(eventName, handler, false);

　　}

　　}

　　}

　　循環每執行一次，都會判斷window對象的attachEvent或addEventListener是否存在，其實這個僅判斷一次也就夠了;此外，“”on” + eventName”的字符串拼接也會重復執行。優化如下：

　　function addEvent(elems, eventName, handler) {

　　var i = -1, len = elems.length;

　　if (window.attachEvent) {

　　eventName = “on” + eventName;

　　while (++i < len) {

　　elems[i].attachEvent(eventName, handler);

　　}

　　} else if (window.addEventListener) {

　　while (++i < len) {

　　elems[i].addEventListener(eventName, handler, false);

　　}

　　}

　　}

　　2.2 盡量使用原生的函數而不是自定義函數

　　當你對Javascript的內置類型變量執行某項操作時，你應該先查查這項操作是否有原生的方法。

　　要生成一個數組的副本，你會怎么做呢?遍歷數組元素然后逐個賦值到另一個數組，這似乎是唯一的方法。其實，原生的Array.prototype.slice就可以達到復制的目的。這個方法可以從某個數組返回選定的元素，且不影響原來的數組。如果參數留空，返回的就是全部元素。

　　Array.prototype.slice還可以對某些不是數組而又能通過數字索引訪問的類型進行操作，比如arguments：

　　function test() {

　　alert(Array.prototype.slice.call(arguments));

　　}

　　test(1, 2, 3); // output “1,2,3″

　　在Firefox下，它甚至可以對HtmlCollection進行操作。可惜在IE下不行。

　　另一個例子是數組排序，一般情況下，我們不需要另外寫排序算法，用原生的Array.prototype.sort就夠了。sort方法只有一個參數，該參數是一個函數，決定兩個相比較的元素誰在前誰在后，默認是按照字符順序排序，比如11會排在2之前。要按數字大小排序，可以這樣寫：

　　var arr = [11, 2, 0, 12, 33];

　　arr.sort(

　　function(a, b) {

　　return a - b;

　　}

　　);

　　也可以按照對象的某個屬性進行排序：

　　var arr = [

　　{ id : 11 },

　　{ id : 0 },

　　{ id : 22 }

　　];

　　arr.sort(

　　function(a, b) {

　　return a.id - b.id;

　　}

　　);

　　2.3 數組去重復

　　Array類型并沒有提供去重復的方法，如果要把數組的重復元素干掉，那得自己想辦法：

　　function unique(arr) {

　　var result = [], isRepeated;

　　for (var i = 0, len = arr.length; i < len; i++) {

　　isRepeated = false;

　　for (var j = 0, len = result.length; j < len; j++) {

　　if (arr[i] == result[j]) {

　　isRepeated = true;

　　break;

　　}

　　}

　　if (!isRepeated) {

　　result.push(arr[i]);

　　}

　　}

　　return result;

　　}

　　總體思路是把數組元素逐個搬運到另一個數組，搬運的過程中檢查這個元素是否有重復，如果有就直接丟掉。從嵌套循環就可以看出，這種方法效率極低。我們可以用一個hashtable的結構記錄已有的元素，這樣就可以避免內層循環。恰好，在Javascript中實現hashtable是極為簡單的，改進如下：

　　function unique(arr) {

　　var result = [], hash = {};

　　for (var i = 0, elem; (elem = arr[i]) != null; i++) {

　　if (!hash[elem]) {

　　result.push(elem);

　　hash[elem] = true;

　　}

　　}

　　return result;

　　}

　　三、使代碼更易讀、更好維護

　　無論是在開發中還是開發后，保持代碼清晰易讀可以更快更準確地修改代碼。

　　3.1 連接HTML字符串

　　相信做前端開發的朋友都受過這個折磨：連接HTML的時候被可惡的單引號、雙引號搞得頭昏腦脹。比如：

　　element.innerHTML = ‘<a href=”‘ + url + ‘” onclick=”alert(” + msg + ‘’);”>’ + text + ‘</a>’;

　　這里介紹一個字符串格式化函數：

　　String.format = function(str) {

　　var args = arguments, re = new RegExp(”%([1-" + args.length + "])”, “g”);

　　return String(str).replace(

　　re,

　　function($1, $2) {

　　return args[$2];

　　}

　　);

　　};

　　調用方法很簡單：

　　element.innerHTML = String.format(’<a href=”%1″ onclick=”alert(’%2’);”>%3</a>’, url, msg, text);

　　意思就是用第n個參數把%n替換掉。這樣一來清晰多了吧。

　　3.2 為您的程序打造一個Config配置對象

　　編寫Java或者C#程序的時候，我們一般會從XML讀取程序的配置信息。在Javascript里面，用XML做配置信息不大劃算，一方面要多請求一個XML文件或者把XML字符串轉換為XML對象，另一方面XML對象的方法比較復雜冗長。輕量級的JSON是最好的選擇。

　　程序中的常量應該放到Config配置對象中，比如Ajax請求的Url、某個操作的提示等，例如：

　　var Config = {

　　ajaxUrl : “test.jsp”,

　　successTips : “請求完成”

　　};

　　如果Config的數量較多，可以根據配置類型多嵌套一層，比如：

　　var Config = {

　　url : {

　　src1 : “test1.jsp”,

　　src2 : “test2.jsp”,

　　.

　　.

　　},

　　tips : {

　　src1Suc : “請求1完成”,

　　src2Suc: “請求2完成”,

　　.

　　.

　　}

　　};

　　Config應放置于程序的最前面，方便查看和修改。