数据传输的常用格式JSON

妖狐艹你老母 2022-06-16 07:42 887阅读 0赞

数据传输的常用格式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 对象表示法语法的子集。  
数据使用名/值对表示。  
使用大括号保存对象，每个名称后面跟着一个 ':'（冒号），名/值对之间使用 ,（逗号）分割。  
使用方括号保存数组，数组值使用 ,（逗号）分割。  
下面是一个简单的示例：

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 创建对象，可以将下面的代码保存为

2、创建数组对象  
下面的例子展示了在 JavaScript 中使用 JSON 创建数组对象。

四、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应该序列化的数据：

\----------反序列化  
拿到一个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}