尝试访问数组返回undefined

Question

我以为我这样做是正确的，但这可能是一个彻头彻尾的noob错误。

这是我的JSON数据

{
"rows": {
    "row1": {
        "divs": 7,
        "offset": 0,
        "colors": {
            "color1": "#003366",
            "color2": "#336699",
            "color3": "#3366CC",
            "color4": "#003399",
            "color5": "#000099",
            "color6": "#0000CC",
            "color7": "#000066"
        }
    },
    "row2": {
        "divs": 8,
        "offset": 11,
        "colors": {
            "color1": "#006666",
            "color2": "#006699",
            "color3": "#0099CC",
            "color4": "#0066CC",
            "color5": "#0033CC",
            "color6": "#0000FF",
            "color7": "#3333FF",
            "color8": "#333399"
        }
    },
    "row3": {
        "divs": 9,
        "offset": 22,
        "colors": {
            "color1": "#669999",
            "color2": "#009999",
            "color3": "#33CCCC",
            "color4": "#00CCFF",
            "color5": "#0099FF",
            "color6": "#0066FF",
            "color7": "#3366FF",
            "color8": "#3333CC",
            "color9": "#666699"
        }
    }
}
}

我把它保存到文件中并将其推送到像这样的数组

var colorPicker = []

$(function () {
$.getJSON("js/json/colorPicker.json", function (data) {
    colorPicker.push(data)
});
})

现在我正在尝试访问此数组。 我可以进入colorPicker[0] 这将返回整个对象。

Object {rows: Object}

当我执行colorPicker[0].rows时，它将返回3行

Object {row1: Object, row2: Object, row3: Object}

但是当我做colorPicker[0][1]时，不应该只给我一行吗？ 我继续未定义。

当我做colorPicker[0].rows.row1然后我可以从那里访问我的值。但是，如果我想为每个循环使用a，那么做colorPicker[0][1].divs之类的东西会更容易吗？我接近这个错误吗？

Answer 1

由于它是一个对象，你不能通过索引0,1,2，而是你需要给出键的名称，所以如果你想迭代对象里面的所有键，你可以做这样的事情： -

$.each(colorPicker[0]['rows'], function(key){
    console.log(colorPicker[0]['rows'][key]); // replace it with whatever you want to do with the row, key=row1/row2/row3
    console.log(colorPicker[0]['rows'][key].divs);
    //for getting all colors
    var temp = colorPicker[0]['rows'][key]["colors"];
    $.each(temp, function(key1){
        console.log(temp[key1]);
    });
});

Answer 2

您已按字符串"row1"，"row2"，"row3"等命名每一行。

要访问它们，您应该使用colorPicker[0]["row1"]或colorPicker[0].row1 - 但第一个选项可以通过编程方式完成 - 循环播放。

我也认为你的转换不正确。您是否尝试过jQuery.parseJSON？

Answer 3

Use a JSON formatter/validation tool to validate that your JSON is what you think it is.

如果你想要数组访问，你必须使用数组："rows" : []是一个数组，"rows" : {}是一个对象/地图：

{
    "rows": [
        {
            "divs": 7,
            "offset": 0,
            "colors": {
                "color1": "#003366",
                "color2": "#336699",
                "color3": "#3366CC",
                "color4": "#003399",
                "color5": "#000099",
                "color6": "#0000CC",
                "color7": "#000066"
            }
        },
        {
            "divs": 8,
            "offset": 11,
            "colors": {
                "color1": "#006666",
                "color2": "#006699",
                "color3": "#0099CC",
                "color4": "#0066CC",
                "color5": "#0033CC",
                "color6": "#0000FF",
                "color7": "#3333FF",
                "color8": "#333399"
            }
        },
        {
            "divs": 9,
            "offset": 22,
            "colors": {
                "color1": "#669999",
                "color2": "#009999",
                "color3": "#33CCCC",
                "color4": "#00CCFF",
                "color5": "#0099FF",
                "color6": "#0066FF",
                "color7": "#3366FF",
                "color8": "#3333CC",
                "color9": "#666699"
            }
        }
    ]
}