優化多個變量

Question

我會嘗試使用jQuery添加一個類。

var tit = ('.tit a'); 
txt_animal = ['pig','horse','rabbit','cat','monkey']; 
txt_fruit = ['melon','apple','kiwi','orange']; 
txt_hobby = ['movie','ski','swim','dance','internet','baseball']; 

$(txt_animal).each(function(i,v){ 
    $(tit + ':contains("'+ v +'")').addClass('tag tag_animal'); 
} 
$(txt_fruit).each(function(i,v){ 
    $(tit + ':contains("'+ v +'")').addClass('tag tag_fruit'); 
} 
$(txt_hobby).each(function(i,v){ 
    $(tit + ':contains("'+ v +'")').addClass('tag tag_hobby'); 
} 

它工作正常。但我認爲比這更好的方法。
如何優化JavaScript以獲得最佳性能？代替

Answer 1

在下面的代碼應該避免兩個重複（和昂貴）DOM通過可能的匹配查詢和重複迭代，通過使用正則表達式的每個類的標籤。

var txt = { 
    animal: /(pig|horse|rabbit|cat|monkey)/i, 
    fruit: /(melon|apple|kiwi|orange)/i, 
    hobby: /(movie|ski|swim|dance|internet|baseball)/i 
}; 

$('.tit a').each(function() { 
    var $this = $(this);  // saves three calls to `$(this)` 
    var t = $this.text();  // get the text contents of the link 

    for (var tag in txt) {  // for each key word 
     if (txt[tag].test(t)) { // test the text against the regexp 
      $this.addClass('tag').addClass('tag_' + tag); 
     } 
    } 
}); 

見http://jsfiddle.net/alnitak/DFcFH/1/

Answer 2

優化DRY。

var tit = ('.tit a'); 
var txt = { 
    "animal": ['pig','horse','rabbit','cat','monkey'], 
    "fruit": ['melon','apple','kiwi','orange'], 
    "hobby": ['movie','ski','swim','dance','internet','baseball'] 
}; 

for (var cat in txt) { 
    $(txt[cat]).each(function(i,v){ 
    $(tit + ':contains("'+ v +'")').addClass('tag tag_' + cat); 
    }); 
}