無法訪問Javascript / d3中的數組

Question

我有一個名為ageNames的數組。 當我打印時，我得到：

Array[12]

當您查看元素時，它說：

 1: "Blah" 2: "blah2" length:12 _proto_:Array[0] 

但是，如果我說console.log(ageNames[0])它說的是undefined （就像對所有元素一樣）。 如果執行console.log(ageNames.length)則會得到0 。

到底是怎么回事？

相關代碼：

  var mdata = [];
  var mnames = [];
  var rowID = [];

  var ageNames = [];
  d3.json("whiskey.json", function(error, data) {

  ageNames.push(d3.keys(data[1]).filter(function(key) { return (key !== "Distillery" && key !== "RowID"); }));
data.forEach(function(d) {
    if(d["RowID"] <= 5){

    //console.log(mdata);
    mnames.push(d["Distillery"]);
    rowID.push(d["RowID"]);
    //console.log(d);
    mdata.push(d);

    }
    });

 console.log(ageNames);
 console.log(ageNames.length);

第一行打印Array [12]，您可以查看各個元素。 第二行顯示0。長度如何為0？

}）;

Answer 1

@Lars我對你的小提琴感到困惑。 因此，我會有一個猜測，看看能從哪里得到我們。 json數據在頁面上，但是您正在使用d3.json從服務器調用它（不是因為您正在使用小提琴）。 為了使您的代碼在小提琴上工作，我們可以忽略d3.json調用，但是當您在開發環境中進行嘗試時，請記住將其全部包裝在d3.json調用中，因為Felix指出它是異步的。

話雖這么說，似乎您正在嘗試使用forEach循環創建要在d3條形圖中使用的變量。 我采取了一種在以下代碼中創建對象數組的方法，我認為它將實現您想要的。

jsondata.forEach(function(d) {
    if(d.RowID<=5) {
        var el = {
            mnames: d.Distillery,
            rowID: d.RowID
        };
        mdata.push(el);
    }
});

然后，您可以以通常的方式訪問這些變量，盡管創建我認為想要的數據集似乎需要做很多工作。 您可以只過濾.data行中的數據，如

.data(jsondata.filter(function (d,i) { return //do some magic filtering stuff; })

無論如何，我已經更新了您的提琴，並使用前5個條目創建了條形圖。 我還沒有真正解釋我在這里所做的事情，但是如果您有任何疑問，請留言。