JSON 基础完结

 相信很多做过了一段时间网页开发的人员一定胡经常使用到AJAX，而且传输的数据一般都是一连串自己定义好的字符串,然后再通过自己写的一个方法将这些字符串进行解析,或者还有人使用的是XML来传输、

而今天我们需要学习的是一个比XML很短小，比字符串上面两个更好解析的一种数据格式,就是JSON，我们这里只是介绍如何的使用JSON，并不讨论它的深层次，有这方面兴趣的可以自己去查看资料.

 

这里我举出一些JSON格式的数据

{
  "name":"json",
  "phone":123456
}

相信很多人都看过这种格式的数据，而且在javascript里会经常的看到.jquery里面这种格式数据的使用也很多.

当然我们不能仅仅满足于这么一点,既然要学JSON一定要能把它运用到实际中.

下面我们直接来一些可以使用的.

<div>
<span id="name"></span>
<span id="phone"></span>
</div>

<script type="text/javascript">
var txt = {
"name":"json",
"phone":123456
};
document.getElementById("name").innerHTML = txt.name;
document.getElementById("phone").innerHTML = txt.phone;
</script>

下面是实际的列子:

 

 这部分应该很简单.

其实 '{}'其中的内容，有点像类的感觉,但并不是的.

你可以暂时认为是给 txt 加上 name 和 phone 属性,并且给他们赋了 json 和 123456 这些值,其中json是字符串 123456 是数字

其后在访问这些数据,并显示.

但是上面只能显示这么一条,很多时候我们的数据都是数组的形式,所以下面就是如何定义数组的:

var txt = 
{
  "data":[
{"name":"json","phone":123},
{"name":"xml","phone":456},
{"name":"string","phone":789}
]};

这里我们可以通过 data[index] 来进行访问,可能有人会问怎么知道里面有多少条数据呢？相信那些爱探索的家伙一定找到了,就是 length

当然上面都是直接写在js代码里面的,但实际的情况是这些数据都是通过其他的方式以字符串来传输到客户端的,并不是一直写在网页上的.那样我们就不可以像上面那样直接来使用了.可能有些'勤劳'的人会去解析字符串,但是之前已经说过了JSON诞生的意义就是化简我们还需要去解析它,所以下面我们将会介绍如何将json字符串转换成 javascript 对象.让我们还可以像上面一样去方便的使用它.

以下是我使用的两种（当然方法很多的）

1. eval

  var txt = '{"data":[

 {"name":"json","phone":123},

{"name":"xml","phone",456},

{"name":"string","phone",789}

]}'

var obj = eval('('+txt+")");

obj.data[0].name;

2. JSON.parse

  var txt = '{"data":[

 {"name":"json","phone":123},

{"name":"xml","phone",456},

{"name":"string","phone",789}

]}'

var obj = JSON.parse(txt);
obj.data[0].name;

但是很多的时候数据都是我们在后台查询数据库,然后进行循环拼接起来的.那么我们需要如下来写

'{
 "data":['+'{"name":"json","phone":123},'+'
  {"name":"xml","phone":456},'+'
  {"name":"string","phone":789}]}';