Javascript：查找值在 JSON 中出现的次数答案

【问题标题】：Javascript: finding the number of times a value occurs in JSONJavascript：查找值在 JSON 中出现的次数
【发布时间】：2013-11-25 16:36:37
【问题描述】：

如果这是一个愚蠢的问题，我想原谅自己，但我无法弄清楚这里出了什么问题。我对 d3 还很陌生，老实说 Javascript 作为一个整体。我有一个 json 文件，看起来像这样：

[{"plaats":"AMSTERDAM","geboortejaar":1990,"vooropleiding":"MBO"}, {"plaats":"GENK","geboortejaar":1987,"vooropleiding":"HAVO"}, {"plaats":"JOPPE","geboortejaar":1992,"vooropleiding":"VWO"}]

我试图弄清楚值“HAVO”、“MBO”和“VWO”在我的 JSON 文件中出现的频率。为此，我编写了以下代码：

var svgHeight = 400;
var svgWidth = 400;

var svg = d3.select("#pieChart")
    .append("svg")
    .attr("height", svgHeight)
    .attr("width", svgWidth);

d3.json("propedeuse.json", function (error, json) {

    alert("Hello, " + json[2]);

    var VWO = 0,
        HAVO = 0,
        MBO = 0;

    for (var i = 0; i <= json.length; i++) { 

        if (json[i].vooropleiding == "VWO") {
            VWO++; 
        }

        else if (json[i].vooropleiding == "HAVO") {
            HAVO++;
        }

        else {
            MBO++;
        }
    }

    svg.append("p")
    .text(HAVO);

    console.log("MBO: " + HAVO);
    console.log("HAVO: " + HAVO);
    console.log("VWO: " + VWO);

    });

我确实收到了警报，“你好，[object Object]”。但根据我的控制台 json[i] 是未定义的。为什么它突然未定义，而它在警报中工作得很好？

我需要做的是（在本例中）控制台为每个值记录 1。

【问题讨论】：

您上面的示例和代码不完整/不正确。数组中只有 3 个元素，因此 json[16] 未定义。警报应该说“你好，未定义”。在没有看到实际数据的情况下，这只是一个猜测，但可能是您的数组元素之一缺少属性vooropleiding（或拼写错误）？
@StephenThomas 那是我的错，我使用的实际 json 文件在数组中有 282 个元素，我现在只使用了三个作为示例。谢谢你告诉我，我现在编辑它。

标签： javascript json filter

【解决方案1】：

http://jsfiddle.net/jL2We/1/

var data = [{"plaats":"AMSTERDAM","geboortejaar":1990,"vooropleiding":"MBO"}, {"plaats":"GENK","geboortejaar":1987,"vooropleiding":"HAVO"}, {"plaats":"JOPPE","geboortejaar":1992,"vooropleiding":"VWO"}];

// Inside d3.json, your "json" variable is equivalent to this "data"

var vwo = data.filter(function(d) { return d.vooropleiding === "VWO"; }).length,
    havo = data.filter(function(d) { return d.vooropleiding === "HAVO"; }).length,
    mbo = data.filter(function(d) { return d.vooropleiding === "MBO"; }).length;

document.getElementById("vwo").innerText = vwo;
document.getElementById("havo").innerText = havo;
document.getElementById("mbo").innerText = mbo;

我同意@Jonah。这只是一个 JavaScript 问题。这是另一种方法。

【讨论】：

非常感谢！我有点希望会有一个过滤功能，我只是没想到它会被这样调用。但是，是的，这对我帮助很大。
它是 ECMAScript 5 中的标准，即be careful in IE < 9。有一个 jQuery.grep 函数可以为那些旧浏览器扩展功能，或者使用 ES5 shim。
另外，您已经知道如何将 JSON 源转换为数组（在您的情况下，D3 会为您执行此操作），因此如果您将问题标题更改为诸如“如何查找值在对象数组中出现的次数”之类的东西。必须获得那些互联网积分！

【解决方案2】：

您的问题似乎与 d3 无关。这实际上只是一个 javascript 问题。这将返回一个具有所需计数的对象：

var json = [{"plaats":"AMSTERDAM","geboortejaar":1990,"vooropleiding":"MBO"}, {"plaats":"GENK","geboortejaar":1987,"vooropleiding":"HAVO"}, {"plaats":"JOPPE","geboortejaar":1992,"vooropleiding":"VWO"}];

var answer = json.reduce(function(prev, cur) {  
    var val = cur["vooropleiding"];
    prev[val] = (prev[val] || 0) + 1;
    return prev;
}, {});

【讨论】：

感谢您抽出宝贵时间提供帮助。