如何在javascript代码上进行性能调优？ （基于JQuery选择器）

Question

如何在该代码中进行性能调整

var isHighLighted = this.HighlightCell(this.GetOutcomeInList(i), i, "selectedByEditor "+((isCommonChoice) ? "Common" : "") ); 

if (!isHighLighted) {
        isHighLighted = this.HighlightCell(this.GetOutcomeInOtherBetsButton(i), i, "selectedByEditor "+((isCommonChoice) ? "Common" : "") ); 
}

this.HighlightCell(this.GetOutcomeInOthers(i), i, "selectedByEditor "+((isCommonChoice) ? "Common" : "") ); 

var spacialcell = this.GetOutcomeInSpecial(i);
this.HighlightCell(spacialcell, i, "selectedByEditor "+((isCommonChoice) ? "Common" : "") );

if (spacialcell.length > 0) {
        //Özel etkinliklerde kapalı alanları açar
        var eventDetails = $(spacialcell).parent().parent().parent();
        var eventHeaders = $(spacialcell).parent().parent().parent().prev().find('.Expand');

        if (eventDetails.attr('status') != 'expand') {
                eventDetails.show(); $(eventHeaders).not('.Collapse').addClass('Collapse');
                BetFilter.ChangeExpandButtonStatus(this, false);
        }
}

超过1000个html单元格元素中每个编辑器数据的函数循环。编辑器数据可能包含10到100个数据。 GetOutcomeInList，GetOutcomeInOtherBetsButton函数是返回特定单元格的jquery选择器。

Answer 1

首先 - 不要重复自己。

你重复这个表达四次：

"selectedByEditor "+((isCommonChoice) ? "Common" : ""

也：

var eventDetails = $(spacialcell).parent().parent().parent();
var eventHeaders = $(spacialcell).parent().parent().parent().prev().find('.Expand');

应该是：

var eventDetails = $(spacialcell).parent().parent().parent();
var eventHeaders = eventDetails.prev().find('.Expand');

其次，在添加类之前无需检查该类是否存在：

$(eventHeaders).not('.Collapse').addClass('Collapse');

可以是：

$(eventHeaders).addClass('Collapse');