遍历Json返回的数据几种方法

首先声明，本人是菜鸟级别，根据自己的理解，来探讨json的遍历，如有不对，请多多指教，接受吐槽！

Json在Web开发的用处非常广泛，作为数据传递的载体，如何解析Json返回的数据是非常常用的。下面介绍下解析Json的几种方式：

遍历json返回的数据关键要分清楚是对象还是数组

先来介绍几种遍历的方法：

js遍历方法

//数组
var list1=["aa","bb","cc","dd"];
　　alert(list1[1]) //bb
for(var i in list1){
    alert(i)//输出所引值
    alert(list1[i])
}
for(var i=0;i<list1.length;i++){    //一般用啦遍历数组比较好
    alert(list1[i])//输出值
}
//对象
var list2={"name":"ddm","age":"24","sex":"nv"}
for(var i in list2){   //for in 用来枚举对象的属性  一般对象可以用这个来遍历
    alert(list2[i])//输出键值对的值
}

//jquery提供的each遍历方法
$.each(list1,function(index,value){  //同
    alert(index)  //遍历数组的时候 第一个参数为索引值   第二个参数为索引值对应的值
    alert(value)
})

$.each(list2,function(key,value){
    alert(key)  //遍历对象时候第一个参数为属性名  第二个参数为属性名对应的值
    alert(value)
})

//数组对象
var list3 = [{"name":"ddm","age":"24","sex":"nv"}];
    alert(list3[0].name)//ddm
    alert(list3[0]["name"])//ddm  属性要用个双引号

下面来看几个具体的例子：

案例1：

//json 对象
var obj={
    "china":｛
        {"city":"hagnzhou","item":1},
        {"city":"shanghai","item":2},
        {"city":"wuhan","item":3}
    ｝,
    "America":{
        {"city":"aa","item":1},
        {"city":"bb","item":2},
        {"city":"cc","item":3}
    },
    "France":{
        {"city":"dd","item":1},
        {"city":"ee","item":2},
        {"city":"ff","item":3}
    }
};

for(var countryObj in obj){
    // alert(countryObj)
    document.write(countryObj+'<br />')  //打印出国家的名字
    for(var cityObj in obj[countryObj]){
        document.write('--'+cityObj+'<br />') //城市名字 item
        for(var itemObj in obj[countryObj][cityObj]){
            document.write('----'+itemObj+','+obj[countryObj][cityObj][itemObj]+'<br />')
        }
    }
}

解释：

　　countryObj是对象obj的属性名字
      obj[countryObj]为对象obj的属性值
      cityObj 为对象obj[countryObj] 的属性名
      itemObj 为对象obj[countryObj][cityObj]的属性名字
      obj[countryObj][cityObj][itemObj] 这个是对象obj[countryObj][cityObj]的值

案例2：

//json数组对象
var obj={
    "china":[
        {"city":"hagnzhou","item":1},
        {"city":"shanghai","item":2},
        {"city":"wuhan","item":3}
    ],
    "America":[
        {"city":"aa","item":1},
        {"city":"bb","item":2},
        {"city":"cc","item":3}
    ],
    "France":[
        {"city":"dd","item":1},
        {"city":"ee","item":2},
        {"city":"ff","item":3}
    ]
};

for(var countryObj in obj){
    // alert(countryObj)
    document.write(countryObj+'<br />') 
    for(var i=0;i<obj[countryObj].length;i++){  //遍历数组  在这里也可以用for in 遍历 
        alert(obj[countryObj].length)
        document.write('--'+obj[countryObj][i]["city"]+'<br />')
    }
}

解释：

countryObj 为对象obj的属性名
obj[countryObj]为countryObj 属性值，只不过在这里为数组  obj[countryObj]。length为数组的长度
obj[countryObj][i]数组的选项  === jsond对象
obj[countryObj][i]["city"]取得name的值 obj[countryObj][i].city

jquery遍历方法

例子3：each()

var obj={
    "china":[
        {"city":"hagnzhou","item":1},
        {"city":"shanghai","item":2},
        {"city":"wuhan","item":3}
    ],
    "America":[
        {"city":"aa","item":1},
        {"city":"bb","item":2},
        {"city":"cc","item":3}
    ],
    "France":[
        {"city":"dd","item":1},
        {"city":"ee","item":2},
        {"city":"ff","item":3}
    ]
};

//each()的遍历方法
$.each(obj,function(key,value){   //这里跟for in 的解释一样
    document.write(key+'<br />');
    for(var i=0;i<value.length;i++){   //这里也可以用each()
        document.write("-----"+value[i]["city"]+'<br />')
    }
})

  我知道的就这些方法了，其实用for In  还是for  还是each（）就看大家喜欢了。关键要清楚是对象还是数组

 

　　

 

转载于:https://www.cnblogs.com/yoyoqd0512/p/4745646.html