JSON对象的两个方法细解

JSON对象

1、stringify()

原型:

JSON.stringify(obj, callback, spaceNumber);

说明:

1.1 将**对象**、**数组**转换为JSON字符串;

1.2 也可以转换boolean类型(true变为字符串“true”)、
    number类型(1变为字符串“1”)、
    string类型(字符串“1”变为字符串“”1“”,注意,这个多了一对引号,外面的一对引号表示是字符串,里面的一对引号是修饰1的)、
    null类型(null变为字符串“null”)、

1.3 不能转换undefined(返回undefined)
    函数(返回同上);

2.1 第一个参数obj表示被序列化的对象,具体参照1.1~1.3

2.2 第二个参数表示回调函数,即用于处理第一个对象的函数。
    他是递归的执行的,有两个参数;
    第一个参数key是key,第二个参数val是值val;
    this指向的是当前被递归的对象。
    正常情况下,初始的key是空字符串,val是stringify的参数1;
    然后遍历stringify的参数1的各个属性,该怎么转就怎么转,如果遇见val是对象,再遍历val的各个属性

2.3 第三个参数表示空白符,默认是0,即字符串在一行。
    当大于0的时候(假如为n),每个key、val组合单独一行,并缩进n个空白符。
    同级的缩进保持一致,如果某个属性是对象,则该属性的key、val组合相对于该对象的缩进程度,再缩进n个空白符

3.  总结:
    简单来说,由于对象是树形的,因此从根往叶逐个递归遍历序列化目标。

    一般来说,不需要有第二、三个参数。
    当有第二个参数时,需要有返回值,返回值是val(即使用这个的原因是val可能被处理)
    同时,如果返回的val是个对象,那么该val则将被递归遍历处理(即使原val不是对象,但因为对象会被递归,因此val会被递归遍历)

    当有第三个参数时,一般是为了格式化显示。

更多参见demo

2、parse()

原型:

JSON.parse(obj, callback);

说明:

1. 用于处理被序列化后的对象,
2. 第一个参数是被反序列化的对象,第二个参数是在反序列化对象结束后,再遍历结果,然后对值进行处理的回调函数;
3. 一般情况下,只需要第一个参数即可
4. 注意,第二个函数在执行前,已经反序列化结束了,然后遍历反序列化结束后返回的对象
5. this是当前遍历的对象,key是当前遍历的属性,val的当前遍历的属性的值,返回值是经过处理后当前所遍历的属性的值;
6. 直接返回val则没变化;
7. 返回undefined,则该属性和值不会被继续递归(假如值是一个对象的话),也不会添加到最后JSON.parse()返回的值之中。

3、toString()

JSON.toString()返回值是字符串”[object JSON]”

DEMO页面可以从我的github上面down下来:
https://github.com/qq20004604/some_demo/blob/master/ES5%E7%9A%84JSON%E5%AF%B9%E8%B1%A1/demo.html

或者用下面的:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JSON对象</title>
</head>
<body>
<div>
    按F12查看console
</div>
<script>
    var test1 = {
        str: "字符串",
        num: 123,
        obj: {
            obj1: "1",
            obj2: 2
        }
    };
    var result1 = JSON.stringify(test1, function (key, val) {
        console.log(this);
        console.log(key);
        console.log(val);
        return typeof val === 'string' ? val + "←处理过" : val;
    }, 4);
    console.log(result1);
    console.log("————————分割线————————")
    var result2 = JSON.parse(result1, function (key, val) {
        console.log(this);
        console.log(key);
        console.log(val);
        return key === 'obj' ? undefined : val;
    })
    console.log(result2);
</script>
</body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值