Javascript 计算数组中每个值的对象数

我有这个阵列：

var markers = [
  {
    "type":"Chocolate",
    "name":"KitKat",
    "group":"candy",
    "icon":"candy",
    "coords":[5246,8980],
  },
  {
    "type":"Fruit",
    "name":"Orange",
    "group":"fruits",
    "icon":"fruis",
    "coords":[9012,5493],
  },
  {
    "type":"Fruit",
    "name":"Banana",
    "group":"fruits",
    "icon":"fruis",
    "coords":[9012,5493],
  },
  {
    "type":"Food",
    "name":"Rice",
    "group":"foods",
    "icon":"foods",
    "coords":[6724,9556],
  },
  {
    "type":"Food",
    "name":"Meat",
    "group":"foods",
    "icon":"foods",
    "coords":[6724,9556],
  },
  {
    "type":"Food",
    "name":"Beam",
    "group":"foods",
    "icon":"foods",
    "coords":[6724,9556],
  },
  {
    "type":"Liquid",
    "name":"Water",
    "group":"liquids",
    "icon":"liquids",
    "coords":[6724,9556],
  },
  {
    "type":"Liquid",
    "name":"Coffe",
    "group":"liquids",
    "icon":"liquids",
    "coords":[6724,9556],
  },
]

我想计算每个组在这个数组中有多少项

我用这个数了数：

var count = []

for (var i = 0; i < markers.length; i++) {
  count[markers[i].group] = count[markers[i].group] + 1 || 1 ;
}

我想在另一部分中使用这些值，为此我需要将数组结构更改为如下内容：

count = [
{"item": "candy","qnt":1},
{"item": "foods","qnt":3},
{"item": "fruits","qnt":2},
{"item": "liquids","qnt":2}
]

var total_fruits = 0;
for (var i = 0; i < markers.length; i++) {
  if (markers[i].group == "fruits"){
    total_fruits++
  }
}

<ul>
  <li class="candy">
    <span class="qnt">1</span>
  </li>
  <li class="fruits">
    <span class="qnt">2</span>
  </li>
  <li class="foods">
    <span class="qnt">3</span>
  </li>
  <li class="liquids">
    <span class="qnt">2</span>
  </li>
</ul>

//Add ul
for(var item in count) {
   //Get data and add li (item = candy, count[item] = 1)
}

我知道我可以这样做：

count = [
{"item": "candy","qnt":1},
{"item": "foods","qnt":3},
{"item": "fruits","qnt":2},
{"item": "liquids","qnt":2}
]

var total_fruits = 0;
for (var i = 0; i < markers.length; i++) {
  if (markers[i].group == "fruits"){
    total_fruits++
  }
}

<ul>
  <li class="candy">
    <span class="qnt">1</span>
  </li>
  <li class="fruits">
    <span class="qnt">2</span>
  </li>
  <li class="foods">
    <span class="qnt">3</span>
  </li>
  <li class="liquids">
    <span class="qnt">2</span>
  </li>
</ul>

//Add ul
for(var item in count) {
   //Get data and add li (item = candy, count[item] = 1)
}

var总收益=0；
对于（var i=0；i

但是想象一下，对于一组超过50种类型的人来说，我需要多少if

我将使用html部分中的值与项值类似的类：

count = [
{"item": "candy","qnt":1},
{"item": "foods","qnt":3},
{"item": "fruits","qnt":2},
{"item": "liquids","qnt":2}
]

var total_fruits = 0;
for (var i = 0; i < markers.length; i++) {
  if (markers[i].group == "fruits"){
    total_fruits++
  }
}

<ul>
  <li class="candy">
    <span class="qnt">1</span>
  </li>
  <li class="fruits">
    <span class="qnt">2</span>
  </li>
  <li class="foods">
    <span class="qnt">3</span>
  </li>
  <li class="liquids">
    <span class="qnt">2</span>
  </li>
</ul>

//Add ul
for(var item in count) {
   //Get data and add li (item = candy, count[item] = 1)
}

1.


2.


3.


2.

---

有什么建议或如何改进吗？

预期的输出不正确。数组不能有这样的键值。您可能需要一个对象

var标记=[{
“类型”：“巧克力”，
“名称”：“KitKat”，
“组”：“糖果”，
“图标”：“糖果”，
“coords”：[52468980]，
},
{
“类型”：“水果”，
“名称”：“橙色”，
“集团”：“水果”，
“图标”：“fruis”，
“coords”：[90125493]，
},
{
“类型”：“水果”，
“名称”：“香蕉”，
“集团”：“水果”，
“图标”：“fruis”，
“coords”：[90125493]，
},
{
“类型”：“食物”，
“名称”：“大米”，
“集团”：“食品”，
“图标”：“食品”，
“coords”：[67249556]，
},
{
“类型”：“食物”，
“名称”：“肉”，
“集团”：“食品”，
“图标”：“食品”，
“coords”：[67249556]，
},
{
“类型”：“食物”，
“名称”：“梁”，
“集团”：“食品”，
“图标”：“食品”，
“coords”：[67249556]，
},
{
“类型”：“液体”，
“名称”：“水”，
“组”：“液体”，
“图标”：“液体”，
“coords”：[67249556]，
},
{
“类型”：“液体”，
“名称”：“咖啡”，
“组”：“液体”，
“图标”：“液体”，
“coords”：[67249556]，
},
]
让计数=标记。减少（功能（acc，curr）{
if（会计科目[当前类型]）{
acc[当前类型]+=1；
}否则{
会计科目[当前类型]=1；
}
返回acc；
}, {})
console.log（计数）
/*如果需要对象数组，则不需要对象，
传递一个空数组作为累加器。那么在那
使用findIndex搜索类型是否存在。
如果返回-1，则使用
所需的值，并将其推入蓄能器，
否则，更新该特定索引处的qnt值*/
让count1=标记。减少（功能（acc，curr）{
让getItemIndex=acc.findIndex（函数（项）{
return item.item==curr.group
});
如果（getItemIndex==-1）{
设obj={
项目：当前组，
qnt:1
}
附件推送（obj）
}否则{
acc[getItemIndex].qnt+=1；
}
返回acc；
}, [])
console.log（count1）

预期的输出不正确。数组不能有这样的键和值。您可能需要一个对象

var标记=[{
“类型”：“巧克力”，
“名称”：“KitKat”，
“组”：“糖果”，
“图标”：“糖果”，
“coords”：[52468980]，
},
{
“类型”：“水果”，
“名称”：“橙色”，
“集团”：“水果”，
“图标”：“fruis”，
“coords”：[90125493]，
},
{
“类型”：“水果”，
“名称”：“香蕉”，
“集团”：“水果”，
“图标”：“fruis”，
“coords”：[90125493]，
},
{
“类型”：“食物”，
“名称”：“大米”，
“集团”：“食品”，
“图标”：“食品”，
“coords”：[67249556]，
},
{
“类型”：“食物”，
“名称”：“肉”，
“集团”：“食品”，
“图标”：“食品”，
“coords”：[67249556]，
},
{
“类型”：“食物”，
“名称”：“梁”，
“集团”：“食品”，
“图标”：“食品”，
“coords”：[67249556]，
},
{
“类型”：“液体”，
“名称”：“水”，
“组”：“液体”，
“图标”：“液体”，
“coords”：[67249556]，
},
{
“类型”：“液体”，
“名称”：“咖啡”，
“组”：“液体”，
“图标”：“液体”，
“coords”：[67249556]，
},
]
让计数=标记。减少（功能（acc，curr）{
if（会计科目[当前类型]）{
acc[当前类型]+=1；
}否则{
会计科目[当前类型]=1；
}
返回acc；
}, {})
console.log（计数）
/*如果需要对象数组，则不需要对象，
传递一个空数组作为累加器。那么在那
使用findIndex搜索类型是否存在。
如果返回-1，则使用
所需的值，并将其推入蓄能器，
否则，更新该特定索引处的qnt值*/
让count1=标记。减少（功能（acc，curr）{
让getItemIndex=acc.findIndex（函数（项）{
return item.item==curr.group
});
如果（getItemIndex==-1）{
设obj={
项目：当前组，
qnt:1
}
附件推送（obj）
}否则{
acc[getItemIndex].qnt+=1；
}
返回acc；
}, [])
console.log（count1）

您可以通过

数组执行此操作。reduce

按

组进行分组

，然后使用

对象。条目

和

数组.map

获得所需的输出格式：

var data=[{“type”：“Chocolate”，“name”：“KitKat”，“group”：“candy”，“icon”：“candy”，“coords”：[52468980]，}，{“type”：“Fruit”，“name”：“Orange”，“group”：“fruis”，“group”：“Fruit”，“coords”：[90125493]，}，{“type”：“fruis”，“group”：“Fruit”，“icon”：“fruis”，“coords”：[90125493]，}，{“type”：“Food”，“name”：“Rice”，“name”：“Rice”，“group”：“Rice”，“group”：“食品”，“图标”：“食品”，“坐标”：[67249556]，}，{“类型”：“食品”，“名称”：“肉”，“组”：“食品”，“图标”：“食品”，“坐标”：[67249556]，}，{“类型”：“食品”，“名称”：“梁”，“组”：“食品”，“图标”：“食品”，“坐标”：[67249556]，}，{“类型”：“液体”，“名称”：“水”，“组”：“液体”，“图标”：“液体”，“坐标”：[67249556]，}，{“类型”：“液体”：“液体”：名称“：”咖啡“，”集团“：”液体“，”图标“：”液体“，”坐标“：[67249556]，}，]
const group=data.reduce（（r，c）=>（r[c.group]=（r[c.group]| | 0）+1，r），{}）
log（Object.entries（group.map（[k，v]）=>（{item:k，qnt:v}））

您可以通过