javascript - 循环，获取唯一值并更新

Question

我正在执行以下操作以从 TreeView 中获取某些节点，然后从这些节点中获取文本，过滤文本以删除唯一性，然后将自定义图像附加到重复节点。

为此，我必须循环 4 次。有更简单的方法吗？我担心它在处理大量数据时的性能。

//Append duplicate item nodes with custom icon
function addRemoveForDuplicateItems() {
    var treeView = $('#MyTree').data('t-TreeView li.t-item');
    var myNodes = $("span.my-node", treeView);
    var myNames = [];

    $(myNodes).each(function () {
        myNames.push($(this).text());
    });

    var duplicateItems = getDuplicateItems(myNames);

   $(myNodes).each(function () {
        if (duplicateItems.indexOf($(this).text()) > -1) {
            $(this).parent().append(("<span class='remove'></span>"));
        }
    });
}

//Get all duplicate items removing unique ones
//Input [1,2,3,3,2,2,4,5,6,7,7,7,7] output [2,3,3,2,2,7,7,7,7] 
function getDuplicateItems(myNames) {
    var duplicateItems = [], itemOccurance = {};

    for (var i = 0; i < myNames.length; i++) {
        var dept = myNames[i];
        itemOccurance[dept] = itemOccurance[dept] >= 1 ? itemOccurance[dept] + 1 : 1;
    }
    for (var item in itemOccurance) {
        if (itemOccurance[item] > 1)
            duplicateItems.push(item);
    }
    return duplicateItems;
}

Answer 1

如果我没理解错的话，这里的重点只是标记重复项，对吧？您应该能够通过两个更简单的过程来完成此操作:

var seen = {};
var SEEN_ONCE = 1;
var SEEN_DUPE = 2;

// First pass, build object
myNodes.each(function () {
    var name = $(this).text();
    var seen = seen[name];
    seen[name] = seen ? SEEN_DUPE : SEEN_ONCE;
});

// Second pass, append node
myNodes.each(function () {
    var name = $(this).text();
    if (seen[name] === SEEN_DUPE) {
        $(this).parent().append("<span class='remove'></span>");
    }
});

如果您真的关心性能，请注意迭代 DOM 元素比迭代内存数组更受性能关注。 $(myNodes).each(...) 调用可能比在相同长度的可比较数组上迭代要昂贵得多。通过在数组上运行第二遍并仅在必要时访问 DOM 节点，您可以从中获得一些效率:

var names = [];
var seen = {};
var SEEN_ONCE = 1;
var SEEN_DUPE = 2;

// First pass, build object
myNodes.each(function () {
    var name = $(this).text();
    var seen = seen[name];
    names.push(name);
    seen[name] = seen ? SEEN_DUPE : SEEN_ONCE;
});

// Second pass, append node only for dupes
names.forEach(function(name, index) {
    if (seen[name] === SEEN_DUPE) {
        myNodes.eq(index).parent()
            .append("<span class='remove'></span>");
    }
});