首页 > 代码库 > Js中JSON.stringify()与JSON.parse()与eval()详解及使用案例

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>

 

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