javascript - 按字母顺序组织 JSON 数据

Question

我一直在尝试从 JSON 文档获取数据以按字母顺序输入/输入到 HTML 文档中进行故障排除。我在堆栈溢出上发现了类似的请求；但是，在当前代码中实现解决方案时，JSON 数据不会根据需要重新组织。

当前代码:

$(document).ready(function() {

  //Content Viewer Information
  function checkViewers() {
    //Base Variables
    var viewer = $('#viewed span.user');
    var totalViews = $('#viewed span.user').length;
    var shortenViews = $('#viewed span.user').length -1;

    if (totalViews === 0) {
        $('<span> 0 people have </span>').insertBefore($('#viewed span:last-child'));
    }
    if (totalViews === 2) {
        $('<span> and </span>').insertAfter(viewer.first());
    }
    if (totalViews >= 3) {
        viewer.slice(1).hide();
        $('<span> and </span>').insertAfter(viewer.first());
        $('<span class="user count"></span>').insertAfter(viewer.eq(2));
        $('.count').html(shortenViews + ' more people');
    }
  }

  //JSON Data
  var xhr = new XMLHttpRequest();

  //Sort Alphabetically
    function SortAlphabetically(a, b) {
        a = a.toLowerCase();
        b = b.toLowerCase();

        return (a < b) ? -1 : (a > b) ? 1 : 0;
    }

  xhr.onload = function() {
      if (xhr.status === 200) {
          responseObject = JSON.parse(xhr.responseText);

          var newViewers = '';
          for (var i = 0; i < responseObject.profiles.length; i++) { 
              newViewers += '<span class="user">' + responseObject.profiles[i].firstName + ' ';
              newViewers += responseObject.profiles[i].lastName + '</span>';
              newViewers += ' ';
          }

          responseObject.profiles.sort(function(a, b) {
                return SortAlphabetically(a.firstName, b.firstName);    
            });
            console.log('JSON Sorted');

          //Update Page With New Content
          var viewerSection = $('#viewed');
          viewerSection.html(newViewers);

      }
  };

  xhr.open('GET', 'data.json', true);
  xhr.send(null);

  checkViewers();

});

我不确定这个问题的解决方案是什么，或者是否有更好的方向来按字母顺序对 JSON 数据进行排序。如有任何建议或帮助，我们将不胜感激。

查看当前代码和示例Plunker .

Answer 1

您在构建 HTML 后对数据进行排序。将调用移至 for 循环上方的 responseObject.profiles.sort:

  //excerpt from the code you provided
  //See the plunk for full code
  xhr.onload = function() {
      if (xhr.status === 200) {
          responseObject = JSON.parse(xhr.responseText);
          //SORT BEFORE GENERATING HTML
          responseObject.profiles.sort(function(a, b) {
                return SortAlphabetically(a.firstName, b.firstName);    
            });
            console.log('JSON Sorted');         
          var newViewers = '';
          for (var i = 0; i < responseObject.profiles.length; i++) { 
              newViewers += '<span class="user">' + responseObject.profiles[i].firstName + ' ';
              newViewers += responseObject.profiles[i].lastName + '</span>';
              newViewers += ' ';
          }
         //End of excerpt

骗子:http://plnkr.co/edit/aW1rpiwu6OHiZj8QXA6D?p=preview