尝试访问数组返回undefined

Question

我以为我做得很正确，但这可能是一个完全的初学者错误。

这是我的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时，我可以从那里访问我的值。但是，如果我想使用for each循环，像colorPicker[0][1].divs这样做会更容易，不是吗？我是不是方法错误了？

- Christian4423

---

colorpicker[0].rows.row1 - BillPull

data 是 Object 类型Object {rows: Object}要访问对象的值，您需要指定键。如果指定colorPicker[0]["row1"]您将获得结果。现在，如何迭代对象？对于数组，您知道键是整数，因此可以在循环中更改整数。对象键有点不同，在那里您可以通过以下方式获取键var keys = Object.key(colorPicker[0]); - zmii

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]);
    });
});

- Namit Singal

---

好的，现在它做了我需要的事情。如果我想深入挖掘并访问颜色对象怎么办？ - Christian4423

好的，我也执行了 console.log(data['rows'][key]['colors']) - Christian4423

是的，像这样使用$.each循环遍历颜色，@Christian4423 这个可以吗？ - Namit Singal

哇，太棒了。真是金子般的存在。非常感谢！ - Christian4423

Answer 2

使用JSON格式化/验证工具验证您的JSON是否符合预期。

如果您想要访问数组，您必须使用一个数组："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"
            }
        }
    ]
}

- user177800

Answer 3

你已经通过字符串"row1"，"row2"，"row3"等来命名每一行。

要访问它们，实际上应该使用colorPicker[0]["row1"]或colorPicker[0].row1 - 但第一个选项可以在循环中以编程方式完成。

我还认为你转换不正确。你尝试过使用 jQuery.parseJSON 吗？

- Gyt Dau

---

第一个仍然返回未定义:/ - Christian4423