在JSON迭代中刪除重複

Question

需要遍歷下面的JSON對象以生成報告（表結構中的表格報告）。

報告將基本上包含故事列表&其相關任務狀態。

QueryResults = { 
    "Results": [ 
     { 
      "Name" : "Tech Design", 
      "State" : "Completed", 
      "StoryName" : "FB Integration" 
     }, 
     { 
      "Name" : "Development", 
      "State" : "In-Progress", 
      "StoryName" : "FB Integration" 
     }, 
     { 
      "Name" : "QA Testing", 
      "State" : "Not Started", 
      "StoryName" : "FB Integration" 
     }, 
     { 
      "Name" : "Front End Development", 
      "State" : "Completed", 
      "StoryName" : "FB Integration" 
     }, 
     { 
      "Name" : "Tech Design", 
      "State" : "Not Started", 
      "StoryName" : "Twitter Integration" 
     }, 
     { 
      "Name" : "Development", 
      "State" : "Not Started", 
      "StoryName" : "Twitter Integration" 
     } 
    ] 
} 

HTML來填充：

<table> 
    <tr> 
     <td>StoryName</td> 
     <td>TechDesign</td> 
     <td>FED</td> 
     <td>QA</td> 
     <td>Development</td> 
    </tr> 
    <tr> 
     <td>FB Integration</td> 
     <td>Completed</td> 
     <td>Completed</td> 
     <td>In-Progress</td> 
     <td>In-Progress</td> 
    </tr> 
    ...... 
    ...... 
</table> 

腳本：

for(var i=0; i < QueryResults.Results.length; i++) { 
    data+= '<tr><td>' + QueryResults.Results[i].StoryName + '</td><td>' + QueryResults.Results[i].State + '</td></tr>'; 
} 

// it will list down all the story name i.e. same story name multiple times 

請提供指向刪除，同時遍歷JSON重複的故事名稱並填充其他列各細節。

Answer 1

你不想刪除重複的條目，你想合併它們的每個故事名稱。

var stories = {}; 
for (var i=0; i<QueryResults.Results.length; i++) { 
    var result = QueryResults.Results[i], 
     name = result.StoryName 
    if (!(name in stories)) 
     stories[name] = {}; 
    stories[name][result.Name] = result.State; 
} 
/* console.log(stories): 
{ 
    "FB Integration":{"Tech Design":"Completed","Development":"In-Progress","QA Testing":"Not Started","Front End Development":"Completed"}, 
    "Twitter Integration":{"Tech Design":"Not Started","Development":"Not Started"} 
} */ 

現在你可以建立一個表。

var keys = []; 
for (var i=0; i<QueryResults.Results.length; i++) { 
    var n = QueryResults.Results[i].Name; 
    if (keys.indexOf(n) == -1) 
     keys.push(n); 
} 
var data = "<table><tr><th>Story Name</th>"; 
for (var i=0; i<keys.length; i++) 
    data += "<th>"+keys[i]+"</th>"; 
data += "</tr>"; 
for (var storyname in stories) { 
    data += "<tr><th>"+storyname+"</th>"; 
    for (var i=0; i<keys.length; i++) 
     data += "<td>"+(stories[storyname][keys[i]] || "n.a.")+"</td>"; 
    data += "</tr>"; 
} 
data += "</table>"; 

如果你想確保特定的順序或使用自定義的表頭，你當然也可以使用一個靜態keys陣列：

var keys = ["Tech Design","Front End Development","QA Testing","Development"]; 
var data = "<table><tr><td>StoryName</td><td>TechDesign</td><td>FED</td><td>QA</td><td>Development</td></tr>"; 
for (storyname in stories) { 
…