RUNOOB JavaScript 初识 JSON

初识JSON

1. JSON 简介

• JSON：Java Script Object Notation

• JSON：用于存储和传输数据的格式

• JSON：通常用于服务端向网页传递数据

2. JSON 语法规则

• 数据："key1" : "value1"，"key2" : "value2"
• 对象
  • 对象：大括号 {"name":"Runoob","url":"www.runoob.com"}
  • 数组：方括号 "sites":[ {"name":"Runoob","url":"www.runoob.com"}, {"name":"zhihu","url":"www.zhihu.com"} ]

3. JSON 实例转换为 JavaScript 对象

1. JSON实例

{"sites":[
    {"name":"Runoob", "url":"www.runoob.com"}, 
    {"name":"Google", "url":"www.google.com"},
    {"name":"Taobao", "url":"www.taobao.com"}
]}

2. JSON实例遵循的语法规则：
   • 对象使用{...}
   • 数组使用[...]
   • 数据格式key1 : value1 , key2 : value2
3. JSON实例转化为字符串
   1. {},[],以及: ,包含在" "或' '中
   2. " ... "为避免重复外面使用' '嵌套
   3. 子字符串使用+拼接出完整字符串

<script>
    var text = '{ "sites" : [' +
        '{"name":"Runoob","url":"www.runoob.com"},'+
        '{"name":"zhihu","url":"www.zhihu.com"},' +
        '{"name":"alibaba","url":"www.alibaba.com"} ]}';
</script>

注：此处可使用document.write(typeof(text));打印出此时经转换后的JSON实例的类型
结果：typeof(text) = string

4. 将字符串解析为对象

<script>
   	obj = JSON.parse(text);
    document.write(typeof(obj)); //object
    document.getElementById("demo").innerHTML = obj.sites[1].name + " " + obj.sites[1].url;
</script>

解析为对象后，便可使用对象的两种访问方式读取JSON数据