数据传输的常用格式JSON

数据传输的常用格式JSON
一、什么是JSON
JSON 也就是JavaScript 对象表示法,是一种轻量级的基于文本的开放标准,被设计用于可读的数据交换。约定使用 JSON 的程序包括 C,C++,Java,Python,Perl 等等。
JSON 是 JavaScript Object Notation 的缩写。文件名扩展是 .json。JSON 的网络媒体类型是 application/json。统一标示符类型(Uniform Type Identifier)是 public.json。
JSON 使用范围
1、用于编写基于 JavaScript 应用程序,包括浏览器扩展和网站。
2、JSON 格式可以用于通过网络连接序列化和传输结构化数据。
3、主要用于在服务器和 Web 应用程序之间传输数据。
4、Web 服务和 APIs 可以使用 JSON 格式提供公用数据。
JSON 简单示例
鉴于书籍数据有语言和版本信息,下面的例子展示了使用 JSON 存储书籍信息:
{
    "book": [
        {
            "id":"01",
            "language": "Java",
            "edition": "third",
            "author": "Herbert Schildt"
        },
        {
            "id":"07",
            "language": "C++",
            "edition": "second"
            "author": "E.Balagurusamy"
    }]
}


二、JSON详解
1、JSON 语法规则
JSON 语法是 JavaScript 对象表示法语法的子集。
数据使用名/值对表示。
使用大括号保存对象,每个名称后面跟着一个 ':'(冒号),名/值对之间使用 ,(逗号)分割。
使用方括号保存数组,数组值使用 ,(逗号)分割。
下面是一个简单的示例:

{
    "book": [
        {
            "id":"01",
            "language": "Java",
            "edition": "third",
            "author": "Herbert Schildt"
        },
        {
            "id":"07",
            "language": "C++",
            "edition": "second"
            "author": "E.Balagurusamy"
    }]
}



2、数据类型
JSON 支持以下两种数据结构:
名/值对集合: 这一数据结构由不同的编程语言支持。
有序的值列表: 包括数组,列表,向量或序列等等。
具体来说JSON 值可以是:
------数字(整数或浮点数)
下面的示例展示了数字类型,其值不应该使用引号包裹:
var obj = {marks: 97}
------字符串(在双引号中)
下面的示例展示了字符串数据类型:
var obj = {name: 'Amit'}
------逻辑值(true 或 false)
示例:
var obj = {name: 'Amit', marks: 97, distinction: true}
------对象
它是一个无序的名/值对集合。
对象使用大括号闭合,以 '{' 开始,以 '}' 结尾。
每个名称后面都跟随一个 ':'(冒号),名/值对使用 ,(逗号)分割。
键名必须是字符串,并且不能同名。
当键名是任意字符串时应该使用对象。
下面的例子展示了对象:
{
    "id": "011A",
    "language": "JAVA",
    "price": 500,
}


------数组(在方括号中)
它是一个有序的值集合。
使用方括号闭合,这意味着数组以 [ 开始,以 ] 结尾。
值使用 ,(逗号)分割。
数组索引以 0 开始。
数组可包含多个对象。
当键名是连续的整数时应该使用数组。
示例:
{
"employees": [
{ "firstName":"John" , "lastName":"Doe" },
{ "firstName":"Anna" , "lastName":"Smith" },
{ "firstName":"Peter" , "lastName":"Jones" }
]
}


在上面的例子中,对象 "employees" 是包含三个对象的数组。每个对象代表一条关于某人(有姓和名)的记录。
------注意
JSON 使用 JavaScript 语法。因为 JSON 使用 JavaScript 语法,所以无需额外的软件就能处理 JavaScript 中的 JSON。
通过 JavaScript,可以创建一个对象数组,并像这样进行赋值:
var employees = [
{ "firstName":"Bill" , "lastName":"Gates" },
{ "firstName":"George" , "lastName":"Bush" },
{ "firstName":"Thomas" , "lastName": "Carter" }
];


可以像这样访问 JavaScript 对象数组中的第一项:
employees[0].lastName;
返回的内容是:
Gates
可以像这样修改数据:
employees[0].lastName = "Jobs"
------JSON 文件
JSON 文件的文件类型是 ".json"
JSON 文本的 MIME 类型是 "application/json"


三、JSON对象的创建
JSON 对象可以使用 JavaScript 创建。我们来看看使用 JavaScript 创建 JSON 对象的各种方式:
1、创建单个对象
创建一个空对象:
var JSONObj = {};
创建一个新对象:
var JSONObj = new Object();
创建一个 bookname 属性值为字符串,price属性值为数字的对象。可以通过使用 '.' 运算符访问属性。
var JSONObj = { "bookname ":"VB BLACK BOOK", "price":500 };
这里有一个例子,展示了在 JavaScript 中使用 JSON 创建对象,可以将下面的代码保存为 
<script language="javascript" >


    var JSONObj = { "name" : "tutorialspoint.com", "year"  : 2005 };
    document.write("<h1>JSON with JavaScript example</h1>");
    document.write("<br>");
    document.write("<h3>Website Name="+JSONObj.name+"</h3>");  
    document.write("<h3>Year="+JSONObj.year+"</h3>");  


</script>


2、创建数组对象
下面的例子展示了在 JavaScript 中使用 JSON 创建数组对象。
<script language="javascript" >
document.writeln("<h2>JSON array object</h2>");
var books = {
    "Pascal" : [ 
        { "Name"  : "Pascal Made Simple", "price" : 700 },
        { "Name"  : "Guide to Pascal", "price" : 400 }
    ],                       
    "Scala"  : [
        { "Name"  : "Scala for the Impatient", "price" : 1000 }, 
        { "Name"  : "Scala in Depth", "price" : 1300 }
    ]    
}    
var i = 0
document.writeln("<table border='2'><tr>");
for(i=0;i<books.Pascal.length;i++)
{   
    document.writeln("<td>");
    document.writeln("<table border='1' width=100 >");
    document.writeln("<tr><td><b>Name</b></td><td width=50>"
    + books.Pascal[i].Name+"</td></tr>");
    document.writeln("<tr><td><b>Price</b></td><td width=50>"
    + books.Pascal[i].price +"</td></tr>");
    document.writeln("</table>");
    document.writeln("</td>");
}


for(i=0;i<books.Scala.length;i++)
{
    document.writeln("<td>");
    document.writeln("<table border='1' width=100 >");
    document.writeln("<tr><td><b>Name</b></td><td width=50>"
    + books.Scala[i].Name+"</td></tr>");
    document.writeln("<tr><td><b>Price</b></td><td width=50>"
    + books.Scala[i].price+"</td></tr>");
    document.writeln("</table>");
    document.writeln("</td>");
}
document.writeln("</tr></table>");
</script>




四、JSON与Javascript
1、数据解析
JSON 最常见的用法之一,是从 web 服务器上读取 JSON 数据(作为文件或作为 HttpRequest),将 JSON 数据转换为 JavaScript 对象,然后在网页中使用该数据。
实例 
创建包含 JSON 语法的 JavaScript 字符串:
var txt = '{ "employees" : [' +
'{ "firstName":"Bill" , "lastName":"Gates" },' +
'{ "firstName":"George" , "lastName":"Bush" },' +
'{ "firstName":"Thomas" , "lastName":"Carter" } ]}';


由于 JSON 语法是 JavaScript 语法的子集,JavaScript 函数 eval() 可用于将 JSON 文本转换为 JavaScript 对象。
eval() 函数使用的是 JavaScript 编译器,可解析 JSON 文本,然后生成 JavaScript 对象。必须把文本包围在括号中,这样才能避免语法错误:
var obj = eval ("(" + txt + ")");
在网页中使用 JavaScript 对象:
例子
<p>
First Name: <span id="fname"></span><br />
Last Name: <span id="lname"></span><br />
</p>
<script type="text/javascript">
document.getElementById("fname").innerHTML = obj.employees[1].firstName
document.getElementById("lname").innerHTML = obj.employees[1].lastName
</script>

完整代码:
<html>
<body>
<h2>通过 JSON 字符串来创建对象</h3>
<p>
First Name: <span id="fname"></span><br /> 
Last Name: <span id="lname"></span><br /> 
</p> 
<script type="text/javascript">
var txt = '{"employees":[' +
'{"firstName":"Bill","lastName":"Gates" },' +
'{"firstName":"George","lastName":"Bush" },' +
'{"firstName":"Thomas","lastName":"Carter" }]}';


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


document.getElementById("fname").innerHTML=obj.employees[1].firstName 
document.getElementById("lname").innerHTML=obj.employees[1].lastName 
</script>
</body>
</html>

运行结果:
通过 JSON 字符串来创建对象


First Name: George
Last Name: Bush

2、序列化和反序列化
把任何JavaScript对象变成JSON,就是把这个对象序列化成一个JSON格式的字符串,这样才能够通过网络传递给其他计算机。
如果我们收到一个JSON格式的字符串,只需要把它反序列化成一个JavaScript对象,就可以在JavaScript中直接使用这个对象了。
-------序列化
JSON.stringify()用于从一个对象解析出字符串。
把小明这个对象序列化成JSON格式的字符串:
var xiaoming = {
    name: '小明',
    age: 14,
    gender: true,
    height: 1.65,
    grade: null,
    'middle-school': '\"W3C\" Middle School',
    skills: ['JavaScript', 'Java', 'Python', 'Lisp']
};
JSON.stringify(xiaoming); 


// '{"name":"小明","age":14,"gender":true,"height":1.65,"grade":null,"middle-school":"\"W3C\" Middle School","skills":["JavaScript","Java","Python","Lisp"]}'
要输出得好看一些,可以加上参数,按缩进输出,如下:
JSON.stringify(xiaoming, null, '  ');
结果:
{
  "name": "小明",
  "age": 14,
  "gender": true,
  "height": 1.65,
  "grade": null,
  "middle-school": "\"W3C\" Middle School",
  "skills": [
    "JavaScript",
    "Java",
    "Python",
    "Lisp"
  ]
}


第二个参数用于控制如何筛选对象的键值,如果我们只想输出指定的属性,可以传入Array:
JSON.stringify(xiaoming, ['name', 'skills'], '  ');
结果:
{
  "name": "小明",
  "skills": [
    "JavaScript",
    "Java",
    "Python",
    "Lisp"
  ]
}


还可以传入一个函数,这样对象的每个键值对都会被函数先处理:
function convert(key, value) {
    if (typeof value === 'string') {
        return value.toUpperCase();
    }
    return value;
}


JSON.stringify(xiaoming, convert, '  ');
上面的代码把所有属性值都变成大写:
{
  "name": "小明",
  "age": 14,
  "gender": true,
  "height": 1.65,
  "grade": null,
  "middle-school": "\"W3C\" MIDDLE SCHOOL",
  "skills": [
    "JAVASCRIPT",
    "JAVA",
    "PYTHON",
    "LISP"
  ]
}


如果我们还想要精确控制如何序列化小明,可以给xiaoming定义一个toJSON()的方法,直接返回JSON应该序列化的数据:
var xiaoming = {
    name: '小明',
    age: 14,
    gender: true,
    height: 1.65,
    grade: null,
    'middle-school': '\"W3C\" Middle School',
    skills: ['JavaScript', 'Java', 'Python', 'Lisp'],
    toJSON: function () {
        return { // 只输出name和age,并且改变了key:
            'Name': this.name,
            'Age': this.age
        };
    }
};

JSON.stringify(xiaoming); // '{"Name":"小明","Age":14}'

----------反序列化
拿到一个JSON格式的字符串,我们直接用JSON.parse()把它变成一个JavaScript对象:
JSON.parse('[1,2,3,true]'); // [1, 2, 3, true]
JSON.parse('{"name":"小明","age":14}'); // Object {name: '小明', age: 14}
//注意:单引号写在{}外,每个属性名都必须用双引号,否则会抛出异常。
JSON.parse('true'); // true
JSON.parse('123.45'); // 123.45
JSON.parse()还可以接收一个函数,用来转换解析出的属性:
JSON.parse('{"name":"小明","age":14}', function (key, value) {
    // 把number * 2:
    if (key === 'name') {
        return value + '同学';
    }
    return value;
}); // Object {name: '小明同学', age: 14}








  • 4
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值