如何声明JSON并迭代它?

时间:2015-02-20 12:47:55

标签: javascript json

我的JSON有三个数组对象的集合。每个数组本身都是三个其他对象的集合,总共有九个对象。 这是我的JSON:

{
           "image1" :  [{
                "id": "table",
                "source": "http://test.reinventio.tk/office-space-game-3/images/table.jpg",
                "alert": [],
                "explanation": "Tables are needed for maintaining a good posture and consequently, \n good health - an entrepreneur cant function with a perpetually aching \n back now, can he?"           
            }, {
                "id": "computer",
                "source": "http://test.reinventio.tk/office-space-game-3/images/computer.jpg",
                "alert": [],
                "explanation": "Whats work without a computer?"
            }, {
                "id": "ac",
                "source": "http://test.reinventio.tk/office-space-game-3/images/ac.jpg",
                "alert": [],
                "explanation": "Air cons are luxuries. Besides, \nas an entrepreneur, \nyoure supposed to be sweating it out!"
            }],

            "image2" :  [{
                "id": "sofa",
                "source": "http://test.reinventio.tk/office-space-game-3/images/sofa.jpg",
                "alert": [],
                "explanation": "Sofas are a luxury. Besides, \nstartups are all but cozy and cusiony, like a sofa!"

            }, {
                "id": "xbox",
                "source": "http://test.reinventio.tk/office-space-game-3/images/xbox.jpg",
                "alert": [],
                "explanation": "Gaming in the office space is a strict no-no.\n For an entrepreneur, work itself is play!"
            }, {
                "id": "whiteboard",
                "source": "http://test.reinventio.tk/office-space-game-3/images/whiteboard.jpg",
                "alert": [],
                "explanation": "Wall emulsion paint turns all your walls\n into gigantic whiteboards. So why waste money \non a small one?"
            }],

            "image3" : [{
                "id": "pool",
                "source": "http://test.reinventio.tk/office-space-game-3/images/pooltable.jpg",
                "alert": [],
                "explanation": "Pool-dreams are to be dreamt after your startup grows."
            }, {
                "id": "green",
                "source": "http://test.reinventio.tk/office-space-game-3/images/inofficeplant.jpg",
                "alert": [],
                "explanation": "Landscaping in the office?\n Lifes not a golf course - especially \nfor a startup."
            }, {
                "id": "paper",
                "source": "http://test.reinventio.tk/office-space-game-3/images/paper.jpg",
                "alert": [],
                "explanation": "Be a jugaadu and improvise to save costs \n- why would you want to buy paper when you can use the empty side\n of election pamphlets?"
            }]

}

现在我想访问每个图像对象的source和id,比如'table'或'ac'。问题是它将图像对象赋予i

这是我的JavaScript代码:

for(var rowCtr in a.imageTable){
                var obj=rowCtr;
                for(var colCtr =0;colCtr<obj.length;colCtr++){

                    var imageObject = obj[colCtr];

imageTable是JSON。

3 个答案:

答案 0 :(得分:0)

如果变量imageTable将json引用为已发布,则将遍历包含id的对象的数组,如下所示:

var array = imageTable.image1; // or image2, image3
for(var i=0;i<array.length;i++){
    console.log(array[i].id); //  wil output table, computer, ac
}

&#13;
&#13;
var imageTable = {
           "image1" :  [{
                "id": "table",
                "source": "http://test.reinventio.tk/office-space-game-3/images/table.jpg",
                "alert": [],
                "explanation": "Tables are needed for maintaining a good posture and consequently, \n good health - an entrepreneur cant function with a perpetually aching \n back now, can he?"           
            }, {
                "id": "computer",
                "source": "http://test.reinventio.tk/office-space-game-3/images/computer.jpg",
                "alert": [],
                "explanation": "Whats work without a computer?"
            }, {
                "id": "ac",
                "source": "http://test.reinventio.tk/office-space-game-3/images/ac.jpg",
                "alert": [],
                "explanation": "Air cons are luxuries. Besides, \nas an entrepreneur, \nyoure supposed to be sweating it out!"
            }],

            "image2" :  [{
                "id": "sofa",
                "source": "http://test.reinventio.tk/office-space-game-3/images/sofa.jpg",
                "alert": [],
                "explanation": "Sofas are a luxury. Besides, \nstartups are all but cozy and cusiony, like a sofa!"

            }, {
                "id": "xbox",
                "source": "http://test.reinventio.tk/office-space-game-3/images/xbox.jpg",
                "alert": [],
                "explanation": "Gaming in the office space is a strict no-no.\n For an entrepreneur, work itself is play!"
            }, {
                "id": "whiteboard",
                "source": "http://test.reinventio.tk/office-space-game-3/images/whiteboard.jpg",
                "alert": [],
                "explanation": "Wall emulsion paint turns all your walls\n into gigantic whiteboards. So why waste money \non a small one?"
            }],

            "image3" : [{
                "id": "pool",
                "source": "http://test.reinventio.tk/office-space-game-3/images/pooltable.jpg",
                "alert": [],
                "explanation": "Pool-dreams are to be dreamt after your startup grows."
            }, {
                "id": "green",
                "source": "http://test.reinventio.tk/office-space-game-3/images/inofficeplant.jpg",
                "alert": [],
                "explanation": "Landscaping in the office?\n Lifes not a golf course - especially \nfor a startup."
            }, {
                "id": "paper",
                "source": "http://test.reinventio.tk/office-space-game-3/images/paper.jpg",
                "alert": [],
                "explanation": "Be a jugaadu and improvise to save costs \n- why would you want to buy paper when you can use the empty side\n of election pamphlets?"
            }]

};

var array = imageTable.image1; // or image2, image3
for(var i=0;i<array.length;i++){
    console.log(array[i].id); //  wil output table, computer, ac
}
&#13;
&#13;
&#13;

您可以展开它以使用嵌套循环迭代所有imageX个对象

var keys = Object.keys(imageTable);
for(var i=0;i<keys.length;i++){
    var array = imageTable[keys[i]];
    for(var j=0;j<array.length;j++){
        console.log(array[j].id); //  wil output table, computer, ac, sofa, xbox etc
    }
}

&#13;
&#13;
var imageTable = {
           "image1" :  [{
                "id": "table",
                "source": "http://test.reinventio.tk/office-space-game-3/images/table.jpg",
                "alert": [],
                "explanation": "Tables are needed for maintaining a good posture and consequently, \n good health - an entrepreneur cant function with a perpetually aching \n back now, can he?"           
            }, {
                "id": "computer",
                "source": "http://test.reinventio.tk/office-space-game-3/images/computer.jpg",
                "alert": [],
                "explanation": "Whats work without a computer?"
            }, {
                "id": "ac",
                "source": "http://test.reinventio.tk/office-space-game-3/images/ac.jpg",
                "alert": [],
                "explanation": "Air cons are luxuries. Besides, \nas an entrepreneur, \nyoure supposed to be sweating it out!"
            }],

            "image2" :  [{
                "id": "sofa",
                "source": "http://test.reinventio.tk/office-space-game-3/images/sofa.jpg",
                "alert": [],
                "explanation": "Sofas are a luxury. Besides, \nstartups are all but cozy and cusiony, like a sofa!"

            }, {
                "id": "xbox",
                "source": "http://test.reinventio.tk/office-space-game-3/images/xbox.jpg",
                "alert": [],
                "explanation": "Gaming in the office space is a strict no-no.\n For an entrepreneur, work itself is play!"
            }, {
                "id": "whiteboard",
                "source": "http://test.reinventio.tk/office-space-game-3/images/whiteboard.jpg",
                "alert": [],
                "explanation": "Wall emulsion paint turns all your walls\n into gigantic whiteboards. So why waste money \non a small one?"
            }],

            "image3" : [{
                "id": "pool",
                "source": "http://test.reinventio.tk/office-space-game-3/images/pooltable.jpg",
                "alert": [],
                "explanation": "Pool-dreams are to be dreamt after your startup grows."
            }, {
                "id": "green",
                "source": "http://test.reinventio.tk/office-space-game-3/images/inofficeplant.jpg",
                "alert": [],
                "explanation": "Landscaping in the office?\n Lifes not a golf course - especially \nfor a startup."
            }, {
                "id": "paper",
                "source": "http://test.reinventio.tk/office-space-game-3/images/paper.jpg",
                "alert": [],
                "explanation": "Be a jugaadu and improvise to save costs \n- why would you want to buy paper when you can use the empty side\n of election pamphlets?"
            }]

};

var keys = Object.keys(imageTable);
for(var i=0;i<keys.length;i++){
    var array = imageTable[keys[i]];
    for(var j=0;j<array.length;j++){
        console.log(array[j].id); //  wil output table, computer, ac, sofa, xbox etc
    }
}
&#13;
&#13;
&#13;

答案 1 :(得分:0)

当您使用for (variable in object)时,它会将variable设置为对象的键,而不是值。要访问这些值,您必须使用object[variable]。所以在你的情况下,它应该是:

for (var rowCtr in a.imageTable) {
    var obj = a.imageTable[rowCtr];

答案 2 :(得分:0)

像这样你可以访问每个opicture的id和来源

var id = []; 
var src= [];
for (var rowCtr in a.imageTable) {
        id= a.imageTable[rowCtr].id;
        src= a.imageTable[rowCtr].source;
}