使用 underscore.js 在 javascript 中进行分组/计数答案

【问题标题】：Grouping / counting in javascript using underscore.js使用 underscore.js 在 javascript 中进行分组/计数
【发布时间】：2014-09-26 23:09:15
【问题描述】：

我是 javascript（以及 Stack Overflow）的新手，但遇到了一个似乎无法解决的问题。我正在尝试生成一个简单的饼图，显示我的数据中每个技术值的项目数量。这是我正在使用的数据类型：

[项目 1，Java]
[项目2，Excel]
[项目3，SAS]
[Project4，Java]

上例中的饼图比例为 2:1:1。

我的代码的第一部分加载数据并将其推送到包含 [project, tech] 的数组“techArray”。这部分工作正常 - 我已经在代码的简化版本中对其进行了验证。

然后我想对数组“techArray”进行分组并计算每个技术的实例。为此，我使用了下划线库，如下所示：

var chartData = [];
var techData = _.groupBy(techArray, 'tech');
_.each(techData, function(row) {
    var techCount = row.length;
    chartData = push( {
        name: row[0].tech,
        y: techCount
    });
});

脚本然后使用 highcharts 呈现 chartData 数组。同样，我已验证此部分使用简化（未分组）版本。

上面概述的分组/计数步骤一定有问题，因为我没有看到任何输出，但我根本找不到在哪里。我的解决方案基于以下工作示例：Worked example。

如果有人能发现我所写内容中的错误，或者提出另一种对数组进行分组的方法，我将不胜感激。这似乎应该是一个比事实证明更简单的任务。

【问题讨论】：

标签： javascript arrays highcharts underscore.js

【解决方案1】：

countBy 可以用来代替 groupBy：

var techArray = [
    { project: 'Project1', tech: 'Java'},
    { project: 'Project2', tech: 'Excel'},
    { project: 'Project3', tech: 'SAS'},
    { project: 'Project4', tech: 'Java'},
];

var counts = _.countBy(techArray,'tech');

这将返回一个对象，其中技术作为属性，它们的值作为计数：

{ Java: 2, Excel: 1, SAS: 1 }

要获取 highcharts 表单中的数据，请使用 map 而不是 each：

var data = _.map(counts, function(value, key){
    return {
        name: key,
        y: value
    };
});

【讨论】：

假设我有这个 json: [{couponid: 500 locationid: 10 },{couponid: 600 locationid: 15 }, { couponid: 500 locationid: 10 }, { couponid: 500 locationid: 20 } ] 使用您提供的解决方案，我得到了一组唯一优惠券 ID，每个唯一优惠券 ID 都有计数；这是我经过大量搜索后找到的最简洁的答案；你能告诉我，现在我怎样才能得到每个唯一的优惠券ID，有多少个唯一的位置ID？即在上面的优惠券 500 中将有 2，而优惠券 600 将有 1。我应该将此作为单独的问题发布吗？
@Bhargava 如果我是你，我会发布一个新问题，这样你就可以从许多不同的人回答我们的问题中受益。

【解决方案2】：

这应该可以工作

var techArray = [['Project1','Java'], ['Project2', 'excel'], ['Project3', 'Java']];

var chartData = [];
var techData = _.groupBy(techArray, function(item) {
    return item[1];
});
_.each(techData, function(value, key) {
    var techCount = value.length;
    chartData.push({
        name: key,
        y: techCount
    });
});

_.groupBy 需要获取属性名称或返回被分组值的函数。数组没有tech 属性，所以你不能按它分组。但是，由于我们的techArray 是一个元组数组，我们可以传递一个函数_.groupBy，它返回我们想要分组的值，即每个元组中的第二项。

chartData 现在看起来像这样：

[{
    name: 'Java',
    y: 2
}, {
    name: 'excel',
    y: 1
}]

【讨论】：