浅谈js的键值对key和value
> 昨晚⽆意中看到类似下⾯结构的⼀段代码的取值问题,引起我的兴趣,花了点时间写了个demo给⼤家分享⼀下。。。
1 var obj = [
2 {"2011":{"name":"jyjin","age":20}},
3 {"2012":{"name":"jyjin","age":21}}
4 ];
5
6 var obj1 = {
7 "2013":{"name":"jyjin","age":22},
8 "2014":{"name":"jyjin","age":23}
9 };
js获取json的key和value >仔细观察上⾯的结构,⼤家会发现上⾯两种结构与传统的json或数组数据结构有⼀些区别,2011、2012、2013、2014这些键值对中“键”的地⽅也存储了数据,这种⽅式可能⼤⼤减⼩了⽂件的存储⼤⼩。所以我在取值的时候激动了⼀下,下⾯就来讨论⼀下它的取值⽅式。
>#1.键值对理解技巧
>⽆论上⾯的哪种数据结构,数组也好对象也罢,要分清键值对,我的技巧就是先冒号。*冒号左边的是key,右边的是value,没有冒号默认key从0开始依次递增,显⽰值为value*。
>那么不难理解
1 obj的 key value
2 0 {"2011":{"name":"jyjin","age":20}}
3 1 {"2012":{"name":"jyjin","age":21}}
4
5 obj1的 key value
6 2013 {"name":"jyjin","age":22}
7 2014 {"name":"jyjin","age":23}
>很清晰的发现obj的value再细分key和value就是obj1的key、value划分结构
>#2.键值对的取值
1.for-in--------------------------------
for-in的正确理解⽅式是for(var key in obj),其中obj是js对象或数组,我⽤key是为了更加清晰明了指明,它迭代出来的是key值⽽不是value值。所以⽤for-in遍历数组 出来的值是数组下标,遍历js对象结果是对象属性名。
1 for(var key in obj){
2 console.log(key);
3 }
4 控制台输出:
5 0
6 1
7
8 for(var key in obj1){
9 console.log(key);
10 }
11 控制台输出:
12 2013
13 2014
2.$.each()--------------------------------
jQuery中$.each()⽅法是当之⽆愧的取键值对的好⽅法,可以理解成这样的代码$.each(obj,functi
on(key,value) {...}),obj可以是js对象或数组,key和value分别对应相 应名称值、键值。这⾥⼀个很不好的习惯是书写成function(i,data)这⾥容易错误理解成i代表数组下标,data元素值,其实这种理解是完全错误的!
1 $.each(obj,function(key,value){
2 console.log(key+":"+value);
3 });
4 控制台输出:
5 0:[object Object]
6 1:[object Object]
7
8
9
10 $.each(obj1,function(key,value){
11 console.log(key+":"+value);
12 });
13 控制台输出:
14 2013:[object Object]
15 2014:[object Object]
16
17
18 可以看出这⾥不单单取出for-in可以取出的key,也将value取出了,只不过需要进⼀步对value的键值对取值。。。
19
20 3.⽤for-in和$-each混合使⽤取出obj中的重要数据信息:年份、姓名、年龄
21
22
23 $.each(obj,function(objkey,objvalue){
24 $.each(objvalue,function(key,value){
25 console.log(key+":"+value.name+":"+value.age);
26 });
27 });
28 $.each(obj1,function(key,value){
29 console.log(key+":"+value.name+":"+value.age);
30 });
31
32 控制台输出:
33 2011:jyjin:20
34 2012:jyjin:21
35 2013:jyjin:22
36 2014:jyjin:23
1 for(var objkey in obj){
2 $.each(obj[objkey],function(key,value){
3 console.log(key+":"+value.name+":"+value.age); 4 });
5 }
6 for(var obj1key in obj1){
7 console.log(obj1key)
8 $.each(obj1[obj1key],function(key,value){
9 console.log(":"+value);
10 });
11 }
12
13 控制台输出:
14 2011:jyjin:20
15 2012:jyjin:21
16 2013
17 :jyjin
18 :22
19 2014
20 :jyjin
21 :23
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论