javaweb学习（day13-数据交换和异步请求)-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_51580177/article/details/138065334

一、JSON

1.介绍

1.1 在线文档

JSon 在线文档：https://www.w3school.com.cn/js/js_json_intro.asp
Ajax 在线文档：https://www.w3school.com.cn/js/js_ajax_intro.asp

1.2 JSON 介绍

JSON 指的是 JavaScript 对象表示法（JavaScript Object Notation）
JSON 是轻量级的文本数据交换格式

JSON 独立于语言 [老韩解读：即 java 、php、asp.net , go 等都可以使用 JSON]
JSON 具有自我描述性，更易理解, 一句话，非常的好用

1.3 快速入门

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>json 快速入门案例</title>
    <script type="text/javascript">
        window.onload=function () {
            var myJson = {
                "key1": "林然", // 字符串
                "key2": 123, // Number
                "key3": [1, "hello", 2.3], // 数组
                "key4": {"age": 12, "name": "jack"}, //json 对象
                "key5": [ //json 数组
                    {"k1": 10, "k2": "milan"}, {"k3": 30, "k4": "smith"}
                ]
            };
//访问 json 的属性
            console.log("key1= " + myJson.key1);
// 访问 json 的数组属性
            console.log("key3[1]= " + myJson.key3[1]); // hello
// 访问 key4 的 name 属性
            console.log("name= " + myJson.key4.name); // jack
// 访问 key5 json 数组的第一个元素
            console.log("myJson.key5[0]= " + myJson.key5[0]); //[object, object]
            console.log("myJson.key5[0].k2= " + myJson.key5[0].k2)// milan
        }
    </script>
</head>
<body>
    <h1>json 快速入门</h1>

</body>
</html>

2 JSON 对象和字符串对象转换

2.1 示例

JSON.stringify(json)功能: 将一个 json 对象转换成为 json 字符串
JSON.parse( jsonString )功能 :将一个 json 字符串转换成为 json 对象

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JSON 对象和字符串对象转换</title>
    <script type="text/javascript">
        window.onload=function () {
            // 一个 json 对象
            var jsonObj = {"name": "学习", age: 10};
        //JSON 是一个 build-in 对象,内建对象,有方法可以使用
            console.log(JSON)
        // 把 json 对象转换成为字符串对象
            var jsonStr = JSON.stringify(jsonObj);
            console.log(jsonStr);
        // 把 json 对象的字符串，转换成为 json 对象
            var jsonObj2 = JSON.parse(jsonStr);
            console.log(jsonObj2);
        }
    </script>
</head>
<body>
<h1>JSON 对象和字符串对象转换</h1>
</body>
</html>