Question

我有一个从JSON数组中提取国家/地区列表的函数

function regionPlanOutput(networkGroupId) {
    document.getElementById("country_list").innerHTML = "";
    jQuery.ajax({
        type: 'GET'
        , url: regionApiURL + '/api/v4/networkGroups/' + networkGroupId + '/countries?count=500'
        , dataType: 'json'
        , success: function (networkGroup) {
            jQuery.each(networkGroup.countryList, function (i, countryList) {
                var countryName = countryList.name;
                var flag = countryList.logoUrl;
                var countrycontent = '<li>' + countryName + '</li>';
                console.log(countrycontent)
                jQuery(countrycontent).appendTo("#country_list");
            });
        }
    });
}

目前它只是按照从数组中提取列表的顺序打印列表，如何根据变量countryName按字母顺序对输出进行排序？

Answer 1

而不是在逐步执行networkGroup.countryList时修改循环内的DOM（这会使排序变得更复杂，并且无论如何都是性能上的坏主意），而是在临时数组中捕获国家/地区名称，对该数组进行排序，然后一次性将它放入DOM：

success: function (networkGroup) {
    var output = []; // temporary array
    jQuery.each(networkGroup.countryList, function (i, countryList) {
        output.push('<li>'+countryList.name+'</li>'); // capture each name in the temporary array.  We'll go ahead and include the <li> tags here since it won't affect the sort order
    });
    output.sort(); // sort it
    jQuery("#country_list").append(output.join('')); // drop it into the DOM
}

Answer 2

对返回的数组使用sort方法，因为你要处理数组中的字符串，所以默认为字母顺序。

Answer 3

让我们假设您的networkGroup.countryList看起来像这样：

countryList = [
    {name: "someName", logUrl: "http://example.com"},
    // ...etc.
]

您可以按countryList.name排序：

countryList.sort(function(a, b){
    return (a.name > b.name) ? 1 : ((b.name > a.name) ? -1 : 0)
})

这将排序到位，因此在您运行之后，您的countryList将更改为已排序的顺序。如果您在致电networkGroup.countryList之前对jQuery.each进行排序，那么您应该很高兴。

Answer 4

在success函数中networkGroup已经是JavaScript object，而不是JSON对象。

因此，您只需要使用networkGroup.countryList数组和success: function(networkGroup) { networkGroup.countryList = networkGroup.countryList.sort(function(a, b) { var nameA = a.countryName.toUpperCase(); var nameB = b.countryName.toUpperCase(); if (nameA < nameB) { return -1; } if (nameA > nameB) { return 1; } return 0; }); //The rest of your code }数组来获取已排序的数组。

这应该是你的代码：

var group = {
  countryList: [{
      countryName: "Vietnam",
      prop: "5224"
    },
    {
      countryName: "USA",
      prop: "000"
    },
    {
      countryName: "Palestine",
      prop: "5454"
    },
    {
      countryName: "Nigeria",
      prop: "1717"
    },
    {
      countryName: "Albania",
      prop: "54"
    },
    {
      countryName: "Belgium",
      prop: "1000"
    }
  ]
};



var sortArray = function sortArray(networkGroup) {
  networkGroup.countryList = networkGroup.countryList.sort(function(a, b) {
    var nameA = a.countryName.toUpperCase();
    var nameB = b.countryName.toUpperCase();
    if (nameA < nameB) {
      return -1;
    }
    if (nameA > nameB) {
      return 1;
    }
    return 0;
  });
  return networkGroup.countryList;
}
console.log(sortArray(group));

<强>演示：

这是一个有效的演示片段：

＆＃13;

{{1}}

＆＃13;

在Javascript中按字母顺序排序和打印JSON输出

4 个答案: