如何在Javascript中按特定顺序对数组进行排序

时间：2018-08-23 05:36:42

标签： javascript arrays sorting

我有一个associative array，我需要按照特定的顺序进行排序。每个对象都有一个description键。这是我要重新排列的当前数组。 

[{
    id: "1",
    permission: "Administer Source List",
    description: "Data Source",
    OrgAdmin: "*",
    DataAdmin: "*",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "2",
    permission: "Administer Common Layers",
    description: "Data Source",
    OrgAdmin: "*",
    DataAdmin: "*",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "7",
    permission: "Create Campaigns",
    description: "Campaigns",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "8",
    permission: "Access/modify campaign setup",
    description: "Campaigns",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "*",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "11",
    permission: "View Reports",
    description: "Reports",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "*",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "12",
    permission: "Modify prebuilt reports",
    description: "Reports",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "16",
    permission: "Create portfolio",
    description: "APT",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "17",
    permission: "Access all portfolios (at org)",
    description: "APT",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "*",
    UserAdmin: ""
  },
  {
    id: "20",
    permission: "Administer role templates for org",
    description: "Manage Users",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "21",
    permission: "Add/edit/delete non org-admin users at org",
    description: "Manage Users",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: "*"
  },
  {
    id: "25",
    permission: "Administer organizations & survey programs",
    description: "ABC Admin functions",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "26",
    permission: "Administer all users in system",
    description: "ABC Admin functions",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "Data Source",
    description: "Data Source",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "Campaigns",
    description: "Campaigns",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "Reports",
    description: "Reports",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "APT",
    description: "APT",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "Manage Users",
    description: "Manage Users",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "ABC Admin functions",
    description: "ABC Admin functions",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  }
];

我想使数组像这样：

[{
    permission: "Data Source",
    description: "Data Source",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "1",
    permission: "Administer Source List",
    description: "Data Source",
    OrgAdmin: "*",
    DataAdmin: "*",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "2",
    permission: "Administer Common Layers",
    description: "Data Source",
    OrgAdmin: "*",
    DataAdmin: "*",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "Campaigns",
    description: "Campaigns",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "7",
    permission: "Create Campaigns",
    description: "Campaigns",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "8",
    permission: "Access/modify campaign setup",
    description: "Campaigns",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "*",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "Reports",
    description: "Reports",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "11",
    permission: "View Reports",
    description: "Reports",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "*",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "12",
    permission: "Modify prebuilt reports",
    description: "Reports",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "APT",
    description: "APT",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "16",
    permission: "Create portfolio",
    description: "APT",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "17",
    permission: "Access all portfolios (at org)",
    description: "APT",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "*",
    UserAdmin: ""
  },
  {
    permission: "Manage Users",
    description: "Manage Users",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "20",
    permission: "Administer role templates for org",
    description: "Manage Users",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "21",
    permission: "Add/edit/delete non org-admin users at org",
    description: "Manage Users",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: "*"
  },
  {
    permission: "ABC Admin functions",
    description: "ABC Admin functions",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "25",
    permission: "Administer organizations & survey programs",
    description: "ABC Admin functions",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "26",
    permission: "Administer all users in system",
    description: "ABC Admin functions",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  }
];

是否可以使用description键来实现这一目标？

4 个答案:

答案 0 :(得分：1)

您可以绘制描述及其顺序的地图。在您的sort比较器中使用该映射，请尝试以下操作：

let arr = [ { id: "1", permission: "Administer Source List", description: "Data Source", OrgAdmin: "*", DataAdmin: "*", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" }, { id: "2", permission: "Administer Common Layers", description: "Data Source", OrgAdmin: "*", DataAdmin: "*", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" }, { id: "7", permission: "Create Campaigns", description: "Campaigns", OrgAdmin: "*", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" }, { id: "8", permission: "Access/modify campaign setup", description: "Campaigns", OrgAdmin: "*", DataAdmin: "", SetupAdmin: "*", DataConsumer: "", APTUser: "", UserAdmin: "" }, { id: "11", permission: "View Reports", description: "Reports", OrgAdmin: "*", DataAdmin: "", SetupAdmin: "", DataConsumer: "*", APTUser: "", UserAdmin: "" }, { id: "12", permission: "Modify prebuilt reports", description: "Reports", OrgAdmin: "*", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" }, { id: "16", permission: "Create portfolio", description: "APT", OrgAdmin: "", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" }, { id: "17", permission: "Access all portfolios (at org)", description: "APT", OrgAdmin: "*", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "*", UserAdmin: "" }, { id: "20", permission: "Administer role templates for org", description: "Manage Users", OrgAdmin: "*", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" }, { id: "21", permission: "Add/edit/delete non org-admin users at org", description: "Manage Users", OrgAdmin: "*", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "*" }, { id: "25", permission: "Administer organizations & survey programs", description: "ABC Admin functions", OrgAdmin: "", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" }, { id: "26", permission: "Administer all users in system", description: "ABC Admin functions", OrgAdmin: "", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" }, { permission: "Data Source", description: "Data Source", OrgAdmin: "", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" }, { permission: "Campaigns", description: "Campaigns", OrgAdmin: "", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" }, { permission: "Reports", description: "Reports", OrgAdmin: "", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" }, { permission: "APT", description: "APT", OrgAdmin: "", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" }, { permission: "Manage Users", description: "Manage Users", OrgAdmin: "", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" }, { permission: "ABC Admin functions", description: "ABC Admin functions", OrgAdmin: "", DataAdmin: "", SetupAdmin: "", DataConsumer: "", APTUser: "", UserAdmin: "" } ];
let map = {
  "Data Source"  : 1,
  "Campaigns" : 2,
  "Reports" : 3,
  "APT" : 4,
  "Manage Users" : 5,
  "ABC Admin functions" : 6,
};

arr.sort((a,b) => map[a.description] - map[b.description]);
console.log(arr);

答案 1 :(得分：0)

您可以使用Array.sort并将其传递给自定义排序函数，以根据其自身的值（如果是数字或字符串）或按其任何键（如果这些项是对象）对任何类型的项目进行排序）。

  

sort（）方法对数组中的元素进行排序并返回   数组。排序不一定是稳定的。默认排序顺序   是根据字符串Unicode代码点确定的。

要自定义sort()方法的行为，我们可以将其传递给排序函数。该排序器函数接受2个参数，它们代表数组中的元素。我们需要在此排序函数中返回-1，1或0，其中1指示第一个元素应放在第二个元素-1之前表示应该将第二个元素放置在第二个元素之前，0则可以将两个元素视为相等。

var unsortedArray = [
  {
    id: "1",
    permission: "Administer Source List",
    description: "Data Source",
    OrgAdmin: "*",
    DataAdmin: "*",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "2",
    permission: "Administer Common Layers",
    description: "Data Source",
    OrgAdmin: "*",
    DataAdmin: "*",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "7",
    permission: "Create Campaigns",
    description: "Campaigns",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "8",
    permission: "Access/modify campaign setup",
    description: "Campaigns",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "*",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "11",
    permission: "View Reports",
    description: "Reports",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "*",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "12",
    permission: "Modify prebuilt reports",
    description: "Reports",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "16",
    permission: "Create portfolio",
    description: "APT",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "17",
    permission: "Access all portfolios (at org)",
    description: "APT",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "*",
    UserAdmin: ""
  },
  {
    id: "20",
    permission: "Administer role templates for org",
    description: "Manage Users",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "21",
    permission: "Add/edit/delete non org-admin users at org",
    description: "Manage Users",
    OrgAdmin: "*",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: "*"
  },
  {
    id: "25",
    permission: "Administer organizations & survey programs",
    description: "ABC Admin functions",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    id: "26",
    permission: "Administer all users in system",
    description: "ABC Admin functions",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "Data Source",
    description: "Data Source",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "Campaigns",
    description: "Campaigns",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "Reports",
    description: "Reports",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "APT",
    description: "APT",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "Manage Users",
    description: "Manage Users",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  },
  {
    permission: "ABC Admin functions",
    description: "ABC Admin functions",
    OrgAdmin: "",
    DataAdmin: "",
    SetupAdmin: "",
    DataConsumer: "",
    APTUser: "",
    UserAdmin: ""
  }
];

// array is not sorted yet
// console.log( unsortedArray );

unsortedArray.sort(function(a, b){
  // this is the custom sorter function
  return a['description'].localeCompare(b['description']);
});

// array should now be sorted
console.log( unsortedArray );

答案 2 :(得分：0)

如另一个答案中所述，您可以使用Array.sort()。如果您只关心description，则可以：

myArray.sort((a, b) => a.description < b.description ? -1 : 1)

如果需要考虑其他键，可以使排序功能更加复杂。

答案 3 :(得分：0)

您需要一个函数，该函数会将键值设为<input class="form-control" name="name" type="text" onChange="replaceName(this)" />或所需的任何键值，然后对整个数据进行排序。

在html中以

调用 
description

并将此函数添加到.js 

<button onClick="sortData('description')" >Click To Sort</button>
<button onClick="sortData('id')" >Click To Sort</button>
<button onClick="sortData('permission')" >Click To Sort</button>
<button onClick="sortData('userAdmin')" >Click To Sort</button>

这将对数组进行排序，并在单击后对数组进行排序后显示在任何需要的地方。

相关问题
最新问题