這是陣列；
var dataArr = [
{
"permalink": /* link*/
"subreddit": "mac"
}, {
"permalink": /* link*/
"subreddit": "worldnews"
}, {
"permalink": /* link*/
"subreddit": "MushroomGrowers"
}, {
"permalink": /* link*/
"subreddit": "chrome"
}, {
"permalink": /* link*/
"subreddit": "onions"
}, {
"permalink": /* link*/
"subreddit": "onions"
}, {
"permalink": /* link*/
"subreddit": "SquaredCircle"
}.....
]
基于使用下劃線的“subreddit”鍵，分組似乎很簡單
const grouped = _.groupBy( dataArr, 'subreddit' )
回傳一個類似這樣的物件
{
ArtisanVideos: [
{
"permalink": ' link ',
subreddit: "ArtisanVideos"
},
{
"permalink": ' link ',
subreddit: "ArtisanVideos"
},
{
"permalink": ' link ',
subreddit: "ArtisanVideos"
}
],
chrome: [
{
"permalink": ' link ',
subreddit: "chrome"
}
],
laravel: [
{
"permalink": ' link ',
subreddit: "laravel"
},
{
"permalink": ' link ',
subreddit: "laravel"
},
{
"permalink": ' link ',
subreddit: "laravel"
}
],
mac: [
{
"permalink": ' link ',
subreddit: "mac"
}
]
}
現在，如何根據陣列的長度對分組的物件進行排序
uj5u.com熱心網友回復：
從我上面的評論...
“如果 OP依賴于物件的鍵插入順序（盡管它甚至可以作業）（因為這是 OP 所要求的），那么 OP 的整個資料處理方法就有問題了。人們可以做什么來代替......從分組條目的前一個物件創建一個物件項的排序陣列。”
下一個提供的解決方案完全符合已經提出的建議。
為了實作中間分組目標reduce，將給定的資料結構轉換為分組條目的物件（每個條目包含一些以前的資料陣列項的陣列。
每個entriesnow 都可以被mapped 到仍然未排序的結果陣列的一個自己的物件中，在最后一步中sort，該物件將由每個物件的唯一 array-value length-property 或通過單個屬性名稱（鍵）的區域設定比較來編輯。
function groupAndCollectBySameKeyValue({ key, result }, item) {
const groupValue = item[key];
(result[groupValue] ??= []).push(item);
return { key, result };
}
var dataArr = [
{ permalink: 'link', subreddit: 'laravel' },
{ permalink: 'link', subreddit: 'mac' },
{ permalink: 'link', subreddit: 'ArtisanVideos' },
{ permalink: 'link', subreddit: 'laravel' },
{ permalink: 'link', subreddit: 'ArtisanVideos' },
{ permalink: 'link', subreddit: 'chrome' },
{ permalink: 'link', subreddit: 'ArtisanVideos' },
{ permalink: 'link', subreddit: 'laravel' },
];
console.log(
dataArr
.reduce(groupAndCollectBySameKeyValue, {
key: 'subreddit',
result: {},
})
.result
);
console.log(
Object
.entries(
dataArr
.reduce(groupAndCollectBySameKeyValue, {
key: 'subreddit',
result: {},
})
.result
)
// create object from grouped entry (key-value pair).
.map(([key, value]) => ({ [key]: value }))
.sort((a, b) =>
// ... either by array length ...
Object.values(b)[0].length - Object.values(a)[0].length
// ... or by locale alphanumeric precedence.
|| Object.keys(a)[0].localeCompare(Object.keys(b)[0])
)
);.as-console-wrapper { min-height: 100%!important; top: 0; }其中一個原因也可以實作 OP 的原始目標，但不建議這樣做。不應該真正依賴于物件的鍵插入順序。
function groupAndCollectBySameKeyValue({ key, result }, item) {
const groupValue = item[key];
(result[groupValue] ??= []).push(item);
return { key, result };
}
var dataArr = [
{ permalink: 'link', subreddit: 'laravel' },
{ permalink: 'link', subreddit: 'mac' },
{ permalink: 'link', subreddit: 'ArtisanVideos' },
{ permalink: 'link', subreddit: 'laravel' },
{ permalink: 'link', subreddit: 'ArtisanVideos' },
{ permalink: 'link', subreddit: 'chrome' },
{ permalink: 'link', subreddit: 'ArtisanVideos' },
{ permalink: 'link', subreddit: 'laravel' },
];
console.log(
dataArr
.reduce(groupAndCollectBySameKeyValue, {
key: 'subreddit',
result: {},
})
.result
);
console.log(
Object
.entries(
dataArr
.reduce(groupAndCollectBySameKeyValue, {
key: 'subreddit',
result: {},
})
.result
)
.sort(([aKey, aValue], [bKey, bValue]) =>
// array length first, or locale property name comparison.
bValue.length - aValue.length || aKey.localeCompare(bKey)
)
.reduce((result, [key, value]) =>
// create object by aggregating entries while following
// the above sorted key precedence / key insertion order.
Object.assign(result, { [key]: value }), {}
)
);.as-console-wrapper { min-height: 100%!important; top: 0; }uj5u.com熱心網友回復：
行。在這里你有它。
首先，我們對資料進行排序：
let sorted = data.sort((a, b) => (a.subreddit > b.subreddit) ? 1 : -1);
console.log("sorted: ", sorted);
請注意，我們僅按屬性 subreddit 進行排序，只是為了將它們組合在一起以進行下一步。
接下來，我們創建一個新物件，如果屬性未定義，則創建一個新陣列：
let output = {};
data.forEach((elem) => {
if(output[elem.subreddit] === undefined){
output[elem.subreddit] = new Array();
}
output[elem.subreddit].push(elem);
});
最后，我們進行測驗以確保一切都符合我們的預期：
console.log("same? :", JSON.stringify(expected) == JSON.stringify(output));
let data = [
{ "permalink" : "https://www.apple.com", "subreddit": "mac" },
{ "permalink" : "https://www.microsoft.com", "subreddit": "microsoft" },
{ "permalink" : "https://www.xcode.com", "subreddit": "mac" },
{ "permalink" : "https://www.xbox.com", "subreddit": "microsoft" },
];
let expected = {
"mac": [
{ "permalink" : "https://www.apple.com", "subreddit": "mac" },
{ "permalink" : "https://www.xcode.com", "subreddit": "mac" }
],
"microsoft": [
{ "permalink" : "https://www.microsoft.com", "subreddit": "microsoft" },
{ "permalink" : "https://www.xbox.com", "subreddit": "microsoft" },
]
};
let sorted = data.sort((a, b) => (a.subreddit > b.subreddit) ? 1 : -1);
console.log("sorted: ", sorted);
let output = {};
data.forEach((elem) => {
if(output[elem.subreddit] === undefined){
output[elem.subreddit] = new Array();
}
output[elem.subreddit].push(elem);
});
console.log("output: ", output);
console.log("same? :", JSON.stringify(expected) == JSON.stringify(output));享受。
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/477193.html
標籤：javascript json