編寫高效的 JavaScript

一。最快的條件判斷

if 語句的適用場景

• 2 個之內的離散值需要判斷

• 大量的值能容易的分到不同的區間範圍中

switch 語句的適用場景

• 超過 2 個少於 10 個離散值需要判斷

• 條件值是非線性的，無法分離出區間範圍

數組查詢的適用場景

• 超過 10 個值需要判斷

• 條件對應的結果是單一值，而不是一系列操作

二。字符串操作

字符串連接

現代瀏覽器已經對字符串做了優化，如果字符串較短（少於 20 個字符）且數量較少（少於 1000 個），所有瀏覽器都能用 + 運算符在 1ms 內完成

所以，用push + join優化字符串連接已經沒有必要了，在大多數場景下，直接+就好了

裁剪字符串

ES5 提供了原生的trim，如果環境中沒有，可以使用下面這個最快的trim 實現：

function trim(text) {
    text = text.replace(/^\s+/, '');
    for (var i = text.length - 1; i >= 0; i--) {
        if (/\S/.test(text.charAt(i))) {
            text = text.substring(0, i + 1);
            break;
        }
    }

    return text;
}

或者一個不快但更簡單的版本：

function trim(text) {
    return text.replace(/^\s+/, '').replace(/\s+$/, '');
}

三。數據存取

保證效率的原則如下：

• 用局部變量緩存需要頻繁存取的值

  比如 arr.length，DOMNode List

• 縮短作用域鏈

  除了with 之外，try-catch的catch 也會增長作用域鏈（在作用域鏈頂部增加了一個對象，該對象包含了異常對象），所以盡量不要在catch 塊裡包含太多的代碼，以降低性能影響

參考資料

• 《高性能網站建設進階指南》