JS JSON.stringify 详解

Posted 2023-04-23

参考技术A （1）转换值如果有 toJSON() 方法，该方法定义什么值将被序列化。
如果一个被序列化的对象拥有 toJSON 方法，那么该 toJSON 方法就会覆盖该对象默认的序列化行为：不是该对象被序列化，而是调用 toJSON 方法后的返回值会被序列化，例如：

（2）布尔值、数字、字符串的包装对象在序列化过程中会自动转换成对应的原始值

（3）undefined、任意的函数以及 symbol 值，在序列化过程中会被忽略（出现在非数组对象的属性值中时）或者被转换成 null（出现在数组中时）。函数、undefined 被单独转换时，会返回 undefined，如JSON.stringify(function()) or JSON.stringify(undefined)。

(4) 对包含循环引用的对象（对象之间相互引用，形成无限循环）执行此方法，会抛出错误。

(5) 所有以 symbol 为属性键的属性都会被完全忽略掉，即便 replacer 参数中强制指定包含了它们。

(6) Date 日期调用了 toJSON() 将其转换为 string 字符串（Date.toISOString()），因此会被当做字符串处理。

(7) NaN 和 Infinity 格式的数值及 null 都会被当做 null。

(8) 其他类型的对象，包括 Map/Set/WeakMap/WeakSet，仅会序列化可枚举的属性。

space 参数用来控制结果字符串里面的间距。

Js中JSON.stringify()与JSON.parse()与eval()详解及使用案例

JSON(JavaScript Object Notation)是一种轻量级的数据交换格式。因为采用独立于语言的文本格式，也使用了类似于C语言家族的习惯，拥有了这些特性使使JSON称为理想的数据交换语言，作用是易于阅读和编写，同时也易于机器解析和生成（一般用于网络传输速率）。

一：JSON.parse();

　　作用：将json字符串转换成json对象

　　语法：JSON. parse(text[,reviver])。

　　参数：

　　　　text：必选，一个有效的json字符串。

　　　　reviver：可选。

　　返回值：一个对象或者数组。

    <script type="text/javascript">
        var jsonStr = ‘{"name":"huangxiaojian","age":"23"}‘;
        var jsonObj = JSON.parse(jsonStr);
        console.log(jsonObj); //{name: "huangxiaojian", age: "23"}
    </script>

 

二：JSON.stringify();

　　作用：将json对象转换成json字符串。

　　语法：JSON.stringify(value [, replacer] [, space]) 。

　　参数：

　　　　value：必选，通常为对象或者数组。

　　　　replacer：可选，用于转换结果的函数或者数组。

　　　　space：可选，向返回值 JSON 文本添加缩进、空格和换行符以使其更易于读取。

　　返回值：一个包含json文本的字符串。

    <script type="text/javascript">
        var jsonObj = {"name":"张三","age":"23岁"};
        var jsonStr = JSON.stringify(jsonObj);
        console.log(jsonStr); //{"name":"张三","age":"23岁"}
    </script>

 

三：eval();

　　作用：eval()函数可计算某个字符串，并执行其中的javascript表达式或要执行的语句。

　　语法：eval(string)。

　　参数： string  必须，需要计算的字符串，其中含有要计算的javascript表达式或要执行的语句。

　　返回值：返回计算string的值，没有的话不做任何改变返回。

    <script type="text/javascript">
        eval(‘x = 10; y = 5; console.log(x*y)‘);
        
        console.log(eval(‘5+5‘));
        
        var x = 10;
        console.log(eval(‘x + 5‘));
    </script>

　　使用eval()函数也可以将JSON字符串解析为对象，这个功能能完成JSON.parse()的功能，但是有不一样的地方，请看下面代码 ：

    <script type="text/javascript">
        var str = ‘{"name":"huangxiaojian","age":"23"}‘;
         var info = JSON.parse(str);
        console.log(info); // Object {name: "huangxiaojian", age: "23"}
        var info = eval(‘(‘ + str + ‘)‘);
        console.log(info); // Object {name: "huangxiaojian", age: "23"}
    </script>

　　

　　大家注意到eval()还要用一对圆括号将字符串包起来，对此我寻找到比较好的解释就是：

　　原因：归结于eval本身的问题，由于json是以”{}”的方式来开始以及结束的，在JS中，它会被当成一个语句块来处理，所以必须强制性的将它转换成一种表达式。

　　解决方法：加上圆括号的目的是迫使eval函数在处理JavaScript代码的时候强制将括号内的表达式（expression）转化为对象，而不是作为语句（statement）来执行。举一个例子，例如对象字面量{}，如若不加外层的括号，那么eval会将大括号识别为JavaScript代码块的开始和结束标记，那么{}将会被认为是执行了一句空语句。请看下列例子的不同： 

    <script type="text/javascript">
        console.log(eval("{}")); // undefined
        console.log(eval("(" + "{}" + ")")); // Object {}
    </script>