javascript - 以 Angular 生成 JSON 对象的聚合数组

Question

这是我的 JSON 对象

    $scope.data1 = {
    "totalSize": 5,
    "data": [{
        "id": "AGGAA5V0HGQXEAOJJQitemWOI41FJLY2S",
        "price": 100.00,
        "desc": "Onion and Tomato toppings Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima molestiae cum optio praesentium doloribus, inventore nobis nostrum sequi quidem corporis iure ut natus nemo maxime vitae assumenda aliquam blanditiis. Alias!",
        "status": true,
        "item": "Piza",
        "type": "Veg"
    }, {
        "id": "AGGAA5V0HGQXEAOJJQ9HOI41F9LY2T",
        "price": 90.00,
        "desc": null,
        "status": 0,
        "item": "Pasta",
        "type": "Veg"
    }, {
        "id": "AGGAA5V0HGQXEAOJJQKBOI41G3LY2U",
        "price": 150.00,
        "desc": null,
        "status": 0,
        "item": "Italian Piza",
        "type": "Veg"
    }, {
        "id": "AGGAA5V0HGQXEAOJJS5ZOI43C1LY2V",
        "price": 300.00,
        "desc": null,
        "status": 0,
        "item": "Aloo Paratha",
        "type": "Non-Veg"
    }, {
        "id": "AGGAA5V0HGQXEAOJJSZHOI43L9LY2W",
        "price": 50.00,
        "desc": null,
        "status": 0,
        "item": "Maggie",
        "type": "Veg"
    }]
};

我正在尝试使用它生成以下信息

1. 我已为其生成数组 series = ['Veg','Non-veg'] 的每个类别中的项目数，代码如下:

var series = ($scope.data1.data).reduce(function(res, obj) {
    if (!(obj.type in res))
        res.__array.push(res[obj.type] = obj.type);
    else {
    }
    return res;
}, {__array:[]}).__array;

我正在尝试生成另一个 arry SeriesCount，其预期值为

SeriesCount = [4,1] 

不知何故还没有达到结果，有人可以在这里帮助我吗？

1. 想要生成成本桶和相应的项目数.. 预计

    CostBucketSeries = ['0-100' , '101-300' , '> 300' ];
    CostBucketSeriesCount =[3,2,0];
   

使用 Angular 图我想展示这个... 提前致谢..

Answer 1

问:我正在尝试生成另一个预期值为 arry SeriesCount。

答:您可以通过多种方式获取系列数。例如。迭代 data1.data 并有一个对象来跟踪每种类型的项目的计数。

在下面的示例中，我结合使用了 map 和 forEach API 来解决计数问题。该解决方案是一个优雅的解决方案，因为它不需要您预先知道您拥有什么类型的项目。

注意:您可能想直接跳到解决方案。请参阅代码中的 //solution 注释。

示例代码:

var data1 = {
  "totalSize": 5,
  "data": [{
    "id": "AGGAA5V0HGQXEAOJJQitemWOI41FJLY2S",
    "price": 100.00,
    "desc": "Onion and Tomato toppings Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima molestiae cum optio praesentium doloribus, inventore nobis nostrum sequi quidem corporis iure ut natus nemo maxime vitae assumenda aliquam blanditiis. Alias!",
    "status": true,
    "item": "Piza",
    "type": "Veg"
  }, {
    "id": "AGGAA5V0HGQXEAOJJQ9HOI41F9LY2T",
    "price": 90.00,
    "desc": null,
    "status": 0,
    "item": "Pasta",
    "type": "Veg"
  }, {
    "id": "AGGAA5V0HGQXEAOJJQKBOI41G3LY2U",
    "price": 150.00,
    "desc": null,
    "status": 0,
    "item": "Italian Piza",
    "type": "Veg"
  }, {
    "id": "AGGAA5V0HGQXEAOJJS5ZOI43C1LY2V",
    "price": 300.00,
    "desc": null,
    "status": 0,
    "item": "Aloo Paratha",
    "type": "Non-Veg"
  }, {
    "id": "AGGAA5V0HGQXEAOJJSZHOI43L9LY2W",
    "price": 50.00,
    "desc": null,
    "status": 0,
    "item": "Maggie",
    "type": "Veg"
  }]
};

var series = (data1.data).reduce(function(res, obj) {
  if (!(obj.type in res))
    res.__array.push(res[obj.type] = obj.type);
  else {
  }
  return res;
}, {__array:[]}).__array;

// Solution:
var seriesChart = series.map(type => {
  var count = 0;
  data1.data.forEach( item => {
    if(item.type === type) {
      count += 1;
    }
  });
  return count;
});

输出:

[ 4, 1 ]

我得到的是我首先通过遍历其中的单个类型并循环遍历 data1.data 中的实体来利用您在 series 数据中获得的内容>，如果它们与类型匹配则递增。在 map 结束时 - 您将获得一个由计数组成的数组。

注意:此解决方案未考虑性能，因为您可能注意到它的时间复杂度为 O(n2)。

一种可能的改进方法是用 filter 代替 forEach 调用。这样您就不会重新计算之前已经处理过的项目。

API 引用:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach