JSON数据格式

最新推荐文章于 2024-05-29 17:38:35 发布

Boogie_97

最新推荐文章于 2024-05-29 17:38:35 发布

阅读量514

点赞数

分类专栏： JS 前端文章标签： javascript json 编程语言数据 xml

本文链接：https://blog.csdn.net/qq_38070608/article/details/79390159

版权

JS 同时被 2 个专栏收录

11 篇文章 0 订阅

订阅专栏

前端

9 篇文章 0 订阅

订阅专栏

JSON定义：

JSON 的全称是JavaScript Object Notation(JavaScript 对象表示法)，是一种轻量级的数据交换格式。JSO N 与 XML 具有相同的特性，例如易于人编写和阅读，易于机器生成和解析。但是 JSON 比 XML 数据传输的有效性要高出很多。JSON 完全独立与编程语言，使用文本格式保存。
JSON是存储和交换文本信息的语法。类似XML。
JSON比XML更小、更快，更易解析。是轻量级的文本数据交换格式。
JSON独立于语言。JSON使用JavaScript语法来描述数据对象但是仍然独立于平台和语言。JSON解析器和JSON库支持许多不同的编程语言。更容易理解。

我们通常这样定义：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>JSON教程</title>
</head>
<body>
<h2>JavaScript 创建 JSON 对象</h2>
<p>
    姓名: <span id="jname"></span><br/>
    年龄: <span id="jurl"></span><br/>
    地址: <span id="jslogan"></span><br/>
</p>
<script type="text/javascript">
    var JSONObject={
        "name":"小明",
        "age":12,
        "address":"北京市海淀区"
    };
    document.getElementById("jname").innerHTML=JSONObject.name;
    document.getElementById("jurl").innerHTML=JSONObject.age;
    document.getElementById("jslogan").innerHTML=JSONObject.address;
</script>
</body>
</html>

JSON与XML的异同：

相同之处：

JSON是纯文本
JSON可读性强
JSON具有层级结构
JSON可以通过全球使用最广泛的语言JS来进行解析
JSON可以通过AJAX进行传输

不同之处

么有结束标签。
JSON数据格式相对于XML更短更简洁。
JSON读写的速度更快。
JSON能够使用内建的JavaScript eval()方法进行解析。
JSON能使用数组。
JSON不使用保留字。

优点举例：AJAX应用JSON

对于AJAX应用程序来说，JSON比XML更快更容易使用。
使用XML时：

读取XML文档。
使用XML DOM循环遍历解析文档。
读取并存储在变量中。

使用JSON时：

读取JSON字符串
用eval()处理JSON字符串

从对比我们可以看出。由于XML的标签化，一切信息都由开始标签和结束标签来套用，这就决定了XML解析时的繁琐和不便。并且拿到信息后还要存储在临时变量中，极大地占用内存。但是使用JSON时，JSON本身具有良好的可读性，没有繁重的语义标签类内容，加上JS也有专门解析JSON的方法。所以JSON用起来非常的得心应手。

JSON语法：

JSON是JavaScript对象表示语法的子集。

规则：

数据信息都在键值对中："name":"Bill"
数据由逗号隔开："name":"Jeason","age":25
大括号保存对象：见定义处代码
中括号保存数组：var sites=[{"name":"Bill"},{"name":"Jeason"}]

数据类型：

数字(整数或者浮点数)："age":25
字符串(” “中)："name":"Bill"
布尔值(true或false)："flag":true
数组(在[ ]中)：var sites=[{"name":"Bill"},{"name":"Jeason"}]
对象(在{ }中)：

var JSONObject={
        "name":"小明",
        "age":12,
        "address":"北京市海淀区"
    };

null：{“age”:null}

JSON使用JavaScript
JSON使用JavaScript最大的优点是无需额外的软件就能处理JS中的JSON。通过JS代码。你就可以构建一个对象数组，并向这样进行赋值。

var students=[
    {"name":"Terloa","age":21,"address":"American"},
    {"name":"Mark","age"33:,"address":"China"},
    {"name":"Siven","age"19:,"address":"Canada"}
];

可以这样访问JS对象数组中的第一项(索引从0开始)：

students[0].name

返回的内容为：Terloa
修改数据：students[0].name="Young"

JSON对象

JSON对象使用在（）中书写。
对象可以包含多个键值对。
key必须是字符串，value可以是合理的JSON数据类型。
key和value中使用：分隔开。
每个键值对使用，分隔开

访问对象值
可以使用点号、中括号来访问对象的值：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>JSON对象</title>
</head>
<body>
<script type="text/javascript">
    var myObj,x;
    myObj={"name":"Bill","age":22,"money":null};
    document.write(myObj.name);
    document.write(myObj["name"]);
</script>
</body>
</html>

循环对象
你可以使用for-in来循环对象的属性，在循环属性时只能使用中括号访问属性值。
切记：不能使用点号：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>循环JSON</title>
</head>
<body>
<div id="demo"></div>
<script type="text/javascript">
    var myObj={
        "name":"Bill",
        "runnable":36,
        "site":null
    };
    //访问JSON对象的属性
    for(x in myObj){
        document.getElementById("demo").innerHTML+=x+"<br/>";
    }
    //访问JSON对象的属性值
    for(x in myObj){
        document.getElementById("demo").innerHTML+=myObj[x]+"<br/>";
    }

</script>
</body>
</html>

嵌套JSON对象
JSON对象中可以包含另外一个JSON对象：

myObj = {
    "name":"runoob",
    "alexa":10000,
    "sites": {
        "site1":"www.runoob.com",
        "site2":"m.runoob.com",
        "site3":"c.runoob.com"
    }
}

这样来访问嵌套的JSON对象：

x = myObj.sites.site1;
// 或者
x = myObj.sites["site1"];

修改值
还是使用点号或者中括号来修改JSON对象的值：

myObj.sites.site1 = "www.google.com";
myObj.sites["site1"] = "www.google.com";

删除值

delete myObj.sites.site1;
delete myObj.sites["site1"]

数据转换为JS对象：JSON.parse()
JSON通常用于与服务端交换数据。而接受服务器数据时一般都是字符串，可以使用JSON.parse()将数据转化为JS对象。
例子：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>JSONparse</title>
</head>
<body>
<div id="demo"></div>
<script type="text/javascript">
    var obj=JSON.parse('{"name":"Bill","age":16,"money":null}');
    document.getElementById("demo").innerHTML=obj.name+":"+obj.age;
</script>
</body>
</html>

注意
JSON不能存储Date对象。
如果需要存储Date对象，需要先将其转换为字符串，之后再将字符串转换为Date对象。例如：

var text='{"name":"Young","age":19,"car":null}';
var obj=JSON.parse(text);
obj.getElement("demo").innerHTML=onj.name+"创建日期"obj.initDate;

还可以使用parse的第二个参数来设置：

var text = '{ "name":"Runoob", "initDate":"2013-12-14", "site":"www.runoob.com"}';
var obj = JSON.parse(text, function (key, value) {
    if (key == "initDate") {
        return new Date(value);
    } else {
        return value;
}});

document.getElementById("demo").innerHTML = obj.name + "创建日期：" + obj.initDate;

JS对象转化为JSON：stringify()
在向服务器发送数据时一般都是字符串。
可以使用stringify()将JS对象转换为字符串。
例如：

var obj = { "name":"runoob", "alexa":10000, "site":"www.runoob.com"};
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;

JS数组转换：

var arr = [ "Google", "Runoob", "Taobao", "Facebook" ];
var myJSON = JSON.stringify(arr);
document.getElementById("demo").innerHTML = myJSON;

解析Date对象
JSON不能存储Date对象。
JSON.stringify()会将所有日期转化为字符串。

var obj = { "name":"Runoob", "initDate":new Date(), "site":"www.runoob.com"};
var myJSON = JSON.stringify(obj);
document.getElementById("demo").innerHTML = myJSON;

eval()

还有可以使用eval()将JSON文本转换为JS对象。
eval()使用的是JS编译器，可以解析JSON文本，然后生成JS对象。
例如：

var txt = '{ "sites" : [' +
'{ "name":"CSDN" , "url":"www.CSDN.com" },' +
'{ "name":"google" , "url":"www.google.com" },' +
'{ "name":"微博" , "url":"www.weibo.com" } ]}';

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

document.getElementById("name").innerHTML=obj.sites[0].name 
document.getElementById("url").innerHTML=obj.sites[0].url

但是eval可编译并执行JS代码，这个函数本身有安全问题，了解即可。

网上有很多解析JSON数据的解析器。注意灵活运用。

Boogie_97

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JSON数据格式

JSON定义： JSON 的全称是JavaScript Object Notation(JavaScript 对象表示法)，是一种轻量级的数据交换格式。JSO N 与 XML 具有相同的特性，例如易于人编写和阅读，易于机器生成和解析。但是 JSON 比 XML 数据传输的有效性要高出很多。JSON 完全独立与编程语言，使用文本格式保存。 JSON是存储和交换文本信息的语法。类似XML
复制链接

扫一扫