我喜歡到一些大型網站上去翻閱它們的原代碼,期望能找到一些可以應用到自己的代碼中的模式,或發現一些之前從未聽說過的工具和技巧。可是,在我查看這些大型網站的源代碼時,經常會發現一個問題,那就是重復的代碼執行,重復的功能應用。下面就是一些在查看它們的源代碼時發現一些問題,把這些分享給大家,希望能讓你們更加簡潔高效的寫出JavaScript代碼。
重復的收集元素
我在他們的JavaScript代碼里看到的最常見的問題是重復的收集元素。雖然jQuery選擇器引擎或querySelectorAll的執行速度都很快,但重復的工作就是會多占用時間和資源。這個問題很淺顯,解決的方法如下:
復制代碼 代碼如下:
//
$$(".items").addClass("hide");
// ... 后來又 ...
$$(".items").removeClass("hide");
//
var items = $$(".items");
// ... 從這里開始使用這個引用變量!
復制代碼 代碼如下:
var performMiracle = function() {
// 如果瀏覽器支持A特征...
if(features.someFeature) {
}
// ... 如果不支持
else {
}
};
復制代碼 代碼如下:
var performMiracle = features.someFeature ? function() {
// Plan A stuff
} : function() {
// Plan B stuff
};
復制代碼 代碼如下:
function cleanText(dirty) {
// 去除SCRIPT tags
clean = dirty.replace(/<script[^>]*>([/s/S]*?)<//script>/gi, "");
// Do some more cleaning, maybe whitespace, etc.
return clean;
}
復制代碼 代碼如下:
var scriptRegex = /<script[^>]*>([/s/S]*?)<//script>/gi;
function cleanText(dirty) {
// Get rid of SCRIPT tags
clean = dirty.replace(scriptRegex, "");
// Do some more cleaning, maybe whitespace, etc.
return clean;
}
新聞熱點
疑難解答
圖片精選