点击切换帐号登陆
帐号密码登陆

细说JSON字面量的解析与序列化

6.JSON字面量
===========

**知识点**
1.JSON的定义
2.JSON的解析与序列化

--------------------------------------------------------------

1.JSON的定义
-----------
- JSON: (javaScript Object Notation): js对象表示符号
- JSON: 是一种轻量级的数据交换格式, 非常便于网络传输
- JSON: 目前已经是通用的数据传输格式, 获得了几乎所有编程语言的支持
- JSON: 并不是新数据类型,它只是使用数组或对象字面量表示的数据集合
- JSON对象与普通js对象的区别:
    1. 属性名,字符串,必须写在一对双引号中;
    2. 只允许: 数值, 字符串, 布尔值, Null, 对象, 数组 六种数据类型
    3. 只允许使用字面量方式来定义数据
    
--------------------------------------------------------------

2.JSON的解析与序列化
-----------------
- 解析: eval() 和 JSON.parse()
- 序列化: JSON.stringify()

--------------------------------------------------------------

### 示例代码: code/demo05.html

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>JSON字面量</title>
</head>
<body>
<script>
    // 'JSON' (javaScript Object Notation): js对象表示符号
    // 'JSON' 是一种轻量级的数据交换格式, 非常便于网络传输
    // 'JSON' 目前已经是通用的数据传输格式, 获得了几乎所有编程语言的支持
    // JSON并不是新数据类型,它只是使用数组或对象字面量表示的数据集合

    // JSON对象与普通js对象的区别:
    // 1. 属性名,字符串,必须写在一对双引号中;
    // 2. 只允许: 数值, 字符串, 布尔值, Null, 对象, 数组 六种数据类型
    // 3. 只允许使用字面量方式来定义数据
    var users = [
        {
            "name": "peter",
            "age": 30,
            "grade": {
                "javascript": 80,
                "php": 70
            }
        },
        {
            "name": "Tom",
            "age": 20,
            "grade": {
                "javascript": 90,
                "php": 60
            }
        },
        {
            "name": "Jack",
            "age": 25,
            "grade": {
                "javascript": 40,
                "php": 50
            }
        }

    ];

    // 验证json是否是js对象?
    console.log(typeof users);  // Object
    console.log(users instanceof Object);  // true

    // 访问json中的数据
    console.log(users[0].name);
    console.log(users[1].grade.javascript);

    // json非常适合前后端的数据交互,例如后端通过php/java等生成一个json格式的字符串
    var stu = '{"name": "小岳岳", "grade":{"javascript":60,"php":80}}';
    //前端接收到这个json格式的字符串之后,将它解析还原来js对象
    //1. 使用 eval(), 将json字符串放在一对圆括号中,做为表达式直接求值
    var data1 = eval('('+ stu +')');
    console.log(typeof data1);   // Object
    console.log(data1.name);
    console.log(data1.grade.php);
    //2. eval()方法且有风险,推荐使用JSON.parse()
    var data2 = JSON.parse(stu);
    console.log(typeof data2);   // Object
    console.log(data2.name);
    console.log(data2.grade.php);

    // 与JSON.parse()功能相反的还有一个方法: JSON.stringify()
    // 将json对象序列化为一个json格式的字符中,进行传输或者存储
    var mobile = {
        "brand": "华为P20",
        "price": 3899
    };

    console.log(mobile.brand + ': ' + mobile.price);

    // 转为json字符串
    var jsonStr = JSON.stringify(mobile);

    console.log(typeof jsonStr);
    console.log(jsonStr);

    // 当然,还可以将它还原成js对象
    var jsonObj = JSON.parse(jsonStr);

    console.log(jsonObj.brand);

</script>


</body>
</html>
```


任务

?不会了怎么办
无数据提示暂无评论哟...我要评论
网站导航
网站首页
学习路径
视频教程
开发软件
旗下子站
php中文网
phpstudy
技术文章
文档工具
关于我们
企业合作
人才招聘
联系我们
讲师招募
QQ交流群
QQ交流群
微信公众号
微信公众号