javascript - Jquery返回未排序的数组

Question

这是一个非常奇怪的问题。

我正在调用服务器端方法来返回已按字母顺序排序的郊区数组。

当我直接到达终点时，顺序与预期一致。然而，当Jquery调用该方法时，它会以随机顺序返回...

我怀疑问题与 jquery 函数有关:

function updateSuburbs(suburb_selected,town_id)
{
    var $suburbs = $("#mds_suburbs");
    $suburbs.empty();
    $suburbs.append($("<option></option>").attr("value", "").text('Loading...'));
    url = '/api/rpc/delivery/engine/suburbs/town_id/' + town_id;
    $.ajax({
        type:  'GET',
        async: true,
        url:   url,
        dataType: "json",

        success: function(responseObject){

            $suburbs.empty();
            $suburbs.append($("<option></option>").attr("value", "").text('Select your suburb'));
            if (responseObject.status) {
                if (responseObject.suburbs) {
                    $.each(responseObject.suburbs, function(value,key) {
                        $suburbs.append($("<option></option>").attr("value", value).text(key));
                    });
                    if (suburb_selected !== null && suburb_selected !== '')
                    {
                        $('#mds_suburbs').val(suburb_selected);
                    }
                } else {
                    $suburbs.append($("<option></option>")
                        .attr("value", 0).text('No suburbs for this town...'));
                }
            } else {
                $suburbs.empty();
                $suburbs.append($("<option></option>").attr("value", "").text('Error locations suburb'));
            }
        }
    });
}

EIDT:

进一步的阅读和研究表明，事实上 Chrome 正在自动对对象数组进行排序...:S

服务器端输出:

客户端输出:

Answer 1

这种数据结构在 PHP 中表示为数组可能会产生误导。但值得注意的是，即使在 PHP 中，它们也不称为数字索引从 0 开始的索引数组，而是关联数组。

这些在 JSON 中转换为非数组对象，在 JavaScript 中也是如此。非数组对象的属性在 JavaScript 中没有预定义的顺序，因此它们可能会以不可预测的顺序出现，这可能取决于浏览器。

参见"Does JavaScript Guarantee Object Property Order?"了解更多信息。

解决方案

在 PHP 中，您可以将关联数组转换为索引数组:

而不是:

$suburbs = Array(
    "5190" => "CBD",
    "5823" => "Cloetsville",
    "5984" => "De Zalze"
)

获取这个结构:

$suburbs = Array(
    0 => Array("code" => "5190", "name" => "CBD"),
    1 => Array("code" => "5823", "name" => "Cloetsville"),
    2 => Array("code" => "5984", "name" => "De Zalze")
)

您可以使用以下 PHP 代码进行此转换:

foreach($suburbs as $key => $value) {
    $result[] = ["code" => $key, "name" => $value];
}
$suburbs = $result;

...并像以前一样继续使用 json_encode 将其输出为 JSON。

在 JavaScript 中，您必须按如下方式更改 $.each 回调:

$.each(responseObject.suburbs, function(i, value) {
    $suburbs.append($("<option></option>")
            .attr("value", value.code).text(value.name));
});