如何在foreach循環中僅顯示對象一次？

Question

我有一些對象，我希望它們按簇排序。 我當前的代碼位於每個群集之上，但我希望每個群集僅顯示一次。

var Applications =



 [

{cluster: 'WS', ID: '3113', Name: 'management'},

{cluster: 'WS', ID: '3116', Name: 'Calculator'},

{cluster: 'MIS', ID: '113', Name: 'Mandate'},

{cluster: 'MIS', ID: '116', Name: 'Currency'},
]

var content = "";
Applications.forEach(generateRow);



function generateRow(item, index, arrays) {

    var columns = "";
    var clusterhead ;


    clusterhead = columns + "<td colspan='3'>" + item.cluster + "</td>"  ;
    columns = columns + "<td onclick='testfn(\"" + index + "\", this)'>" +  item.ID + "</td>";
    columns = columns + "<td>" + item.Name + "</td>";
    columns = columns + "<td>" + "<a href='https:" + item.ID + "/ApplicationDetails/'>map</a>" + "</td>";

    content =  content +  "<tr>" + clusterhead + "</tr>" + "<tr>" + columns + "</tr>";

}

//現在的結果是這樣。

      WS
3113 managment appmap
      WS
3116 Calculator appmap

I want to look like this

      WS
3113 managment appmap
3116 Calculator appmap

Answer 1

 var Applications = [ { cluster: 'WS', ID: '3113', Name: 'management' }, { cluster: 'WS', ID: '3116', Name: 'Calculator' }, { cluster: 'MIS', ID: '113', Name: 'Mandate' }, { cluster: 'MIS', ID: '116', Name: 'Currency' }, ] let printedClusters = []; var content = ""; Applications.forEach(generateRow); $('#tbl').append(content) function generateRow(item, index, arrays) { var columns = ""; var clusterhead = ""; if (!printedClusters.includes(item.cluster)) { clusterhead = columns + "<td colspan='3'>" + item.cluster + "</td>"; printedClusters.push(item.cluster); } columns = columns + "<td onclick='testfn(\\"" + index + "\\", this)'>" + item.ID + "</td>"; columns = columns + "<td>" + item.Name + "</td>"; columns = columns + "<td>" + "<a href='https:" + item.ID + "/ApplicationDetails/'>map</a>" + "</td>"; content = content + "<tr>" + clusterhead + "</tr>" + "<tr>" + columns + "</tr>"; } 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table id="tbl"> </table> 

Answer 2

一種解決方案是創建一個臨時字典來對它們進行排序，然后顯示字典的數據。

myDict = [];
data = [{'cluster': 1, 'data': 'yes'}, {'cluster': 2, 'data': 'no'}, {'cluster': 1, 'data': 'yes'}];

data.forEach(elem => {
    if(myDict[elem.cluster])
        myDict[elem.cluster].push(elem.data);
    else
        myDict[elem.cluster] = [elem.data];
})

這樣，數據最終將被排序，因此您可以按所需方式顯示它