|
|
通常擺在我們眼前的如下兩種選擇來作為我們的容器，數組或對象。我這里選擇前者，前者更輕量一點。下面我們就hasClass函數作性能改進。
原來的寫法：
復制代碼 代碼如下:
var hasClass = function(ele,cls) {
return ele.className.match(new RegExp('(//s|^)'+cls+'(//s|$)'));
}
雖然簡短，但做了太多假設了，因為元素有時是未必有className，這時直接返回false就行了。而且match是返回一個數組，和我們期望的布爾值多少有點出入（它在我以前的程序運行良好，完全拜Javascript的自動轉換所賜）。我們用search代替match：
復制代碼 代碼如下:
var hasClass = function(ele,cls) {
return ele.className.search(new RegExp('(//s|^)'+cls+'(//s|$)') > -1);
}
Prototype.js的實現我比較滿意，test方法在所有正則方法中是最輕量的(相反，exec是最重量，最慢，最強大)：
復制代碼 代碼如下:
var hasClass = function(el, cls) {
var classes = el.className;
return (classes > 0) ? (classes == cls ||
new RegExp("(^|//s)" + cls + "(//s|$)").test(classes)) : false;
}
到現在為止，基于正則方法的挖掘可謂改無可改，我們祭出緩存大法：
復制代碼 代碼如下:
(function(){
var c={};
window.hasClass=function(el, cls){
if(!c[cls]){c[cls]=new RegExp("(^|//s)"+cls+"($|//s)");}
return el.className && c[cls].test(el.className);
}
})();
如果這個正則以前創建過，就有以前的，沒有再創建，因此在大量匹配的算法中非常有優勢。放入閉包中是為了防止命名沖突，誰會料到后面會不會殺出一個同名的全局變量c來？!使用和原來的一樣，因為我們是通過window來引用它。
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執行]
注意如果是代替上面的test2的內容
<img src="http://www.jb51.NET/images/logo.gif" alt="mm2" id="test2" class="dd" draggable="true">將會是true。
JavaScript技術：javascript下利用數組緩存正則表達式的實現方法，轉載需保留來源！
鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。
