javascript - 将对象发送到函数，顺序错误

Question

我创建了一个发送 JSON 的函数。然后我用console.log查看了。我的代码是

function json($data) {
  console.log($data);
} 

json({
  "first_name": "First Name",
  "last_name": "Last Name",
  "phone": "Phone",
  "orgname": "Organisation Name",
  "email": "Email",
  "1": "Sign-up Date"
});

在 console.log($data); 我收到这样的输出:

{
  1: "Sign-up Date", 
  first_name: "First Name", 
  last_name: "Last Name", 
  phone: "Phone", 
  orgname: "Organisation Name", 
  email: "Email"
} 

但是我需要这样的

{
  first_name: "First Name", 
  last_name: "Last Name", 
  phone: "Phone", 
  orgname: "Organisation Name", 
  email: "Email", 
  1: "Sign-up Date"
}

问题是我实际上使用的不是 console.log 代码:

$.each($data, function(index, value) {
    $(".custom_fields_with_names").append('<option value="' + index + '">' + value + '</option>');
});

并且我得到的选项顺序错误(“1”在前)。

Answer 1

来自 your comment :

Hey Actually after the console.log I am using $.each($json, function(index, value) { $(".custom_fields_with_names").append('<option value="'+index+'">'+value+'</option>'); }); to append the values in select box

这表明你想维持秩序。如果是这样，请不要使用对象。虽然 JavaScript 对象确实有一个顺序(现在，从 ES2015 开始)，但使用它几乎从来都不是正确的事情，而且正如您所注意到的，它们的顺序不是您想要的顺序(特别是:符合整数索引条件的属性名称首先按数字顺序列出，然后其余属性按创建顺序列出[如果我们只考虑“自己的”属性])。

相反，以有序结构(例如数组)向您的函数提供数据:

json([
  {name: "first_name", value: "First Name"},
  {name: "last_name", value: "Last Name"},
  {name: "phone", value: "Phone"},
  {name: "orgname", value: "Organisation Name"},
  {name: "email", value: "Email"},
  {name: "1", value: "Sign-up Date"}
]);

然后

$.each($data, function(index, entry) {
    $(".custom_fields_with_names").append('<option value="' + entry.name + '">' + entry.value + '</option>');
});

---

我用过 $.each因为你做到了，当然你可以使用 $data.forEach(function(entry) {...反而。我也只使用了 ES5 级别的功能，因为您的问题中没有任何迹象表明您正在使用 ES2015+ 功能。