的JavaScript - 分組物品放入數組

Question

我有一個JavaScript數組是這樣的：

var items = [ 
{ id:1, group:'Produce', name:'Apple', weight: 0.5 }, 
{ id:2, group:'Produce', name:'Banana', weight: 0.2 }, 
{ id:3, group:'Meat', name:'Beef', weight: 1.0 }, 
{ id:4, group:'Meat', name:'Chicken', weight: 0.75 }, 
{ id:5, group:'Dairy', name:'Milk', weight:1.0 } 
]; 

我想通過這個數組的外觀和動態的他們的小組把他們的陣列。我試過以下，但是，它沒有工作：

var groups = []; 
for (var i = 0; i<items.length; i++) { 
    var groupName = items[i].group; 
    if (groups.includes(groupName) === false) { 
    groups[groupName] = new Array(); 
    } 
    groups[groupName].push(items[i]); 
} 

基本上，我試圖在JavaScript中創建一個哈希表。關鍵是組名稱，值是該組中項目的Array。但是，我一直沒有成功。我在這裏錯過了什麼？

非常感謝您的幫助！

Answer 1

您的groups應該是一個對象。

然後，您正在測試groups.includes(groupName)，但它是an array function，並且您正在創建散列表。

而是檢查對象是否存在與groups[groupName] === undefined。

var groups = {}; 
for (var i = 0; i<items.length; i++) { 
    var groupName = items[i].group; 
    if (groups[groupName] === undefined) { 
    groups[groupName] = new Array(); 
    } 
    groups[groupName].push(items[i]); 
} 

Answer 2

我會建議你採用簡單的解決方案。

var items = [ 
 
{ id:1, group:'Produce', name:'Apple', weight: 0.5 }, 
 
{ id:2, group:'Produce', name:'Banana', weight: 0.2 }, 
 
{ id:3, group:'Meat', name:'Beef', weight: 1.0 }, 
 
{ id:4, group:'Meat', name:'Chicken', weight: 0.75 }, 
 
{ id:5, group:'Dairy', name:'Milk', weight:1.0 } 
 
], obj = {}; 
 

 
items.forEach(c => (obj[c.group] || (obj[c.group] = [])).push(c)); 
 

 
console.log(obj);

Answer 3

如果該鍵存在，您可以使用只是一個對象和檢查。如果不採取新陣列。

var items = [{ id: 1, group: 'Produce', name: 'Apple', weight: 0.5 }, { id: 2, group: 'Produce', name: 'Banana', weight: 0.2 }, { id: 3, group: 'Meat', name: 'Beef', weight: 1.0 }, { id: 4, group: 'Meat', name: 'Chicken', weight: 0.75 }, { id: 5, group: 'Dairy', name: 'Milk', weight:1.0 }], 
 
    groups = Object.create(null),   // take a really empty object 
 
    groupName, 
 
    i; 
 
    
 
for (i = 0; i < items.length; i++) { 
 
    groupName = items[i].group; 
 
    if (!groups[groupName]) {    // check if the key in object exists 
 
     groups[groupName] = [];   // if not, assign an empty array 
 
    } 
 
    groups[groupName].push(items[i]); 
 
} 
 

 
console.log(groups);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 4

另一種方法是使用減少：

var items = [ 
 
{ id:1, group:'Produce', name:'Apple', weight: 0.5 }, 
 
{ id:2, group:'Produce', name:'Banana', weight: 0.2 }, 
 
{ id:3, group:'Meat', name:'Beef', weight: 1.0 }, 
 
{ id:4, group:'Meat', name:'Chicken', weight: 0.75 }, 
 
{ id:5, group:'Dairy', name:'Milk', weight:1.0 } 
 
]; 
 

 
const grouped = items.reduce((accum, item) => { 
 
\t accum[item.group] = accum[item.group] ? accum[item.group].concat(item) : [item]; 
 
\t return accum; 
 
}, {}); 
 

 
console.log(grouped);

Answer 5

我alwasy使用lodash或下劃線

但如何永遠，試試這個使用減少功能

var items = [ 
    { id:1, group:'Produce', name:'Apple', weight: 0.5 }, 
    { id:2, group:'Produce', name:'Banana', weight: 0.2 }, 
    { id:3, group:'Meat', name:'Beef', weight: 1.0 }, 
    { id:4, group:'Meat', name:'Chicken', weight: 0.75 }, 
    { id:5, group:'Dairy', name:'Milk', weight:1.0 } 
]; 

Array.prototype.groupDynamically = function(prop) { 
    return this.reduce(function(groups, item) { 
    var val = item[prop]; 
    groups[val] = groups[val] || []; 
    groups[val].push(item); 
    return groups; 
    }, {}); 
} 

//Then in your case say 

var groups = items.groupDynamically('group');