用Javascript处理数组

我对javascript很新，所以请耐心等待！用Javascript处理数组

因此，我通过绑定到API网关的lambda脚本将一些数据从AWS DynamoDB中提取出来。

所以我在我的页面上有一个javascript函数发出一个GET请求的数据，这很好。我能够获取数据。当我得到它，它看起来像这样：

{"Items":[{"issue":"my issue","email":"[email protected]","caseDate":1496543576984,"phone":"1234567890","status":"queueing","enterpriseID":"john.smith"},{"issue":"Test issue 02","email":"[email protected]","caseDate":1496543945585,"phone":"1234567890","status":"queueing","enterpriseID":"john.smithy"}],"Count":2,"ScannedCount":2}

所以我试图建立与数据在网页上动态表。这是我有的代码。注意map函数，我试图改变Items.issue，Items.caseDate等的顺序以匹配列标题。

 var API_URL = 'https://myapi.execute-api.us-west-2.amazonaws.com/dev/cases'; 
 
     var table = document.createElement("table"); 
 
     
 
     $(document).ready(function(){ 
 
      $.ajax({ 
 
       type: 'GET', 
 
       url: API_URL, 
 

 
       success: function(data){ 
 
        
 
        //alert(data); 
 
        
 
        table.setAttribute("id", "myTable"); 
 

 
        var tableHeader = document.createElement("thead"); 
 
        
 
        var headerNames = ["Date", "Enterprise ID", "Client Phone", "Client Email", 
 
             "Case Status", "Client Issue"]; 
 
        
 
        headerNames.forEach(function(header){ 
 
         var tableHeaderItem = document.createElement("th"); 
 
         var headerText = document.createTextNode(header.toString()); 
 
         
 
         tableHeaderItem.appendChild(headerText); 
 
         tableHeader.appendChild(tableHeaderItem); 
 
         
 
        }); 
 

 
        table.appendChild(tableHeader); 
 

 
        data.Items.forEach(function(queueItem){ 
 

 
         var myTableRow = document.createElement("tr"); 
 
         myTableRow.setAttribute("id", queueItem.date); 
 
         
 
         var arr1 = $.map(queueItem, function(value, index) { 
 
          return [value]; 
 
         }); 
 

 
         const map =[2,5,3,1,4,0] 
 
         const arr3 = Array.apply(null, Array(map.length)) 
 
         arr3.map((d, i) => arr3[map[i]] = arr1[i]); 
 
         
 
         arr3.forEach(function(item){ 
 
          var tableItem = document.createElement("td"); 
 
          var itemText = document.createTextNode(item); 
 
          
 
          tableItem.appendChild(itemText); 
 
          myTableRow.appendChild(tableItem); 
 
         }); 
 

 
         table.appendChild(myTableRow); 
 
        }) 
 
        document.getElementById("queueTable").appendChild(table); 
 
       } 
 
      }); 
 
     });

所以，问题是，一旦我拉的实际数据出来的项目之一，并将其推到一个数组遍历它，它在错误的顺序。我该如何解决这个问题，因为地图功能听起来不错，但不起作用。

我应该得到我：

mapping["ID","phone","issue","caseDate","status","email"]

但它实际上得到我：

mapping["caseDate","ID","phone","email","status","issue"]

帮助！我一直在我的头靠在墙上3个小时现在谷歌搜索等，我只是不能完全得到我所需要的。

来源

2017-06-04 Edward S.

实际上[指定]的对象属性迭代顺序（http://www.ecma-international.org/ecma-262/7.0/#sec-ordinaryownpropertykeys）以ES2015开头，但我不知道是否可以依赖在它上面呢。我认为也不应该这样做。（这是对现在删除的评论的回应。） –

那么在lambda中有没有办法做到这一点，以更可预测的方式从DynamoDB中获取数据？我只需要能够根据dynamoDB中的内容生成动态表并将其粘贴到网页上即可。 –

我对迪纳摩一无所知，但您应该可以使用提供的数据并将其格式化为您喜欢的格式。我在下面提供了一个答案，建议比标题列表和重新排序索引列表更直接。 –

而不是headerNames和那些内部映射，你可以使用这样的数据结构，而不是?:

const fields = [ 
    {name: 'caseDate', header: 'Date'}, 
    {name: 'issue', header: 'Client Issue'}, 
    {name: 'email', header: 'Client Email'}, 
    {name: 'phone', header: 'Client Phone'}, 
    {name: 'status', header: 'Case Status'}, 
    {name: 'enterpriseID', header: 'Enterprise ID'} 
]

你可以遍历这些为了使头，脱下header属性，并为每个通过类似item[field.name]的数据从数据中提取命名的字段。

整体看起来更干净。

来源

2017-06-04 22:27:27

用Javascript处理数组

回答

相关问题