按键数对对象数组进行排序 (JavaScript)

Question

大家好，我有一个对象数组（其中 20 个），我以这种格式放置这些对象以在 Angular 项目中创建列（注意对象中有对象）。我想按具有最多键的对象（在数组中的每个对象内）对它们进行排序，到在数组中的对象内具有最少数字键的对象），以便当它们以列显示时最有意义。

我正在改变一个导航栏变量以用于可点击的高级搜索。感谢您的帮助，因为这是我作为新开发人员的第一个大项目。

var clickableFilters = [
  {"State": {
    "0": [{value: "liquid"}, {count: 30}]
    }
  },
  {"Country": {
    "0": [{value: "USA"}, {count: 50}]
    "1": [{value: "Nigeria"}, {count: 90}]
    }
  },
  {"Color": {
    "0": [{value: "blue"}, {count: 30}]
    "1": [{value: "purple"}, {count: 50}]
    "2": [{value: "green"}, {count: 100}]
    }
  }
 ]

如何按键的数量（内部对象中的键）对对象进行排序，以便最终（在 JavaScript 中）

 [{"Color": {}}, {"Country": {}}, {"State": {}}]

Answer 1

解决方案 1

为Array.prototype.sort 使用自定义比较器可以满足您的需要

let data = [{a:1,b:2,c:3}, {a:1}, {a:1,b:2,c:3,d:4}, {a:1,b:2}]

data.sort((a,b) => Object.keys(a).length - Object.keys(b).length)

console.log(data)

解决方案 2

如果您的数据是嵌套的，则子数据应附加到 已知 名称的属性

let data = [
  {foo: 'W', bar: {a:1,b:2,c:3}},
  {foo: 'X', bar: {a:1}},
  {foo: 'Y', bar: {a:1,b:2,c:3,d:4}},
  {foo: 'Z', bar: {a:1,b:2}}
]

let keyToSort = "bar";
data.sort((a,b) => Object.keys(a[keyToSort]).length - Object.keys(b[keyToSort]).length)

console.log(data)

---

陷阱和陷阱

另一方面，如果保证始终只有一个键（可能具有未知/动态名称），则可以编写

Object.keys(a[Object.keys(a)[0]]).length

然而，这显然非常丑陋且容易出错（如果它确实有更多键 - 或者根本没有键怎么办）。如果您可以控制数据结构，则应该考虑重构它，因为只有一个键的 Object 没有多大意义 - 您也可以只删除一个嵌套级别。

---

这是你的未来

你应该养成与复杂性作斗争的习惯——每当它顽固地抬起头来时，抓住你的手杖并对其施加同样顽固的力量。

上面的第一个解决方案似乎有点易于管理，但第二个解决方案开始变得相当厚实。如果您将解决方案分解为可重复使用的微小部分，则可以相对轻松地控制复杂性。

const ascComparator = (a,b) => a < b ? -1 : a > b ? 1 : 0

// use this if you want to sort data descending instead of ascending
const descComparator = (a,b) => ascComparator(b,a)

const prop = x => y => y[x]

const len = prop('length')

const comp = f => g => x => f (g (x))

const keylen = comp (len) (Object.keys)

let data = [
  {foo: 'W', bar: {a:1,b:2,c:3}},
  {foo: 'X', bar: {a:1}},
  {foo: 'Y', bar: {a:1,b:2,c:3,d:4}},
  {foo: 'Z', bar: {a:1,b:2}}
]

// same as solution #2 but much more descriptive
// "sort ascending using keylen of a.bar compared to keylen of b.bar"
data.sort((a,b) => ascComparator(keylen(a.bar), keylen(b.bar)))

console.log(data)

降低复杂性是投资未来的一种方式。一旦你在它自己的过程中包含了一些复杂性，它就会在以后随时供你使用。较小的程序也更容易测试。

ascComparator、prop、len、comp 和 keylen 上面的每个过程都有立即显而易见的意图。您可以随时重新访问这些内容并轻松理解它们。并且由于使用了它们，它也使你的排序更容易读/写。

Answer 2

对于您的数据结构，您可以像这样使用sort()。

var arrayOfObjects = [
  {"least#OfKeysObject": {
    key1: 'value',
    }
  },
  {"secondMost#OfKeysObj": {
    key1: 'value',
    key2: 'value'
    }
  },
  {"most#OfKeysObj": {
    key1: 'value',
    key2: 'value',
    key3: 'value'
    }
  }
 ];
 
 var result = arrayOfObjects.sort(function(a, b) {
   return Object.keys(b[Object.keys(b)[0]]).length - Object.keys(a[Object.keys(a)[0]]).length;
 });
 
 console.log(result)

Answer 3

试试

arrayOfObjects.sort(function(a, b) {
    return Object.keys(a).length > Object.keys(b).length ? -1 : 1;
});