按鍵數對對象數組進行排序（JavaScript）

Question

大家好，我有一個對象數組（其中有20個）以這種格式放置，以在Angular Project中創建列（請注意，對象中有對象）。 我想按具有最多鍵的對象（在數組中的每個對象內部）對它們進行排序，以按數組中的對象內具有最少數字鍵的對象對它們進行排序，以便在它們顯示在列中時最有意義。

我正在對導航欄變量進行突變，以用於可點擊的高級搜索。 感謝您的幫助，因為這是我作為新開發人員的第一個大型項目。

 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;
});