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>
时间: 2024-08-01 10:41:50

Js中JSON.stringify()与JSON.parse()与eval()详解及使用案例的相关文章

JS中的定时函数(setTimeout,clearTimeout,setInterval,clearInterval详解 )

设置定时器,在一段时间之后执行指定的代码,setTimeout与setInterval的区别在于setTimeout函数指定的代码仅执行一次 方法一: window.setTimeout("alert('ok')",5000); 方法二: window.setTimeout(function() { alert("Ok"); }, 5000); 方法三: function showAlert() { alert("ok"); } window.s

转载:Js中的window.parent ,window.top,window.self 详解

原文地址  <Js中的window.parent ,window.top,window.self 详解> 在应用有frameset或者iframe的页面时, parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口, opener是用open方法打开当前窗口的那个窗口. window.self 功能:是对当前窗口自身的引用.它和window属性是等价的. 语法:window.self 注:window.self.window.sel

Node.js中的不安全跳转如何防御详解

Node.js中的不安全跳转如何防御详解 导语: 早年在浏览器大战期间,有远见的Chrome认为要运行现代Web应用,浏览器必须有一个性能非常强劲的Java引擎,于是Google自己开发了一个高性能的开源的Java引擎,名字叫V8.在2009年,Ryan正式推出了基于Java语言和V8引擎的开源Web服务器项目,命名为Node.js. 对于任何web开发人员来说,不安全或未经验证的重定向都是重要的安全考虑因素.Express为重定向提供了本地支持,使它们易于实现和使用.Express是一种保持最

JS中获取 DOM 元素的绝对位置实例详解

在操作页面滚动和动画时经常会获取 DOM 元素的绝对位置,例如 本文 左侧的悬浮导航,当页面滚动到它以前会正常地渲染到文档流中,当页面滚动超过了它的位置,就会始终悬浮在左侧. 本文会详述各种获取 DOM 元素绝对位置 的方法以及对应的兼容性.关于如何获取 DOM 元素高度和滚动高度,请参考视口的宽高与滚动高度 一文. 概述 这些是本文涉及的 API 对应的文档和标准,供查阅: API 用途 文档 标准 offsetTop 相对定位容器的位置 MDN CSSOM View Module clien

Js中的window.parent ,window.top,window.self详解

在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口, opener是用open方法打开当前窗口的那个窗口. window.self 功能:是对当前窗口自身的引用.它和window属性是等价的. 语法:window.self 注:window.self.window.self是等价的. window.top 功能:返回顶层窗口,即浏览器窗口. 语法:window.top 注:如果窗

JS中的call、apply、bind方法详解

bind 是返回对应函数,便于稍后调用:apply .call 则是立即调用 . apply.call 在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为了改变函数体内部 this 的指向.JavaScript 的一大特点是,函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」这样的概念. function fruits() {} fruits.prototype = { color: "red&

json.stringify()的妙用,json.stringify()与json.parse()的区别

一.JSON.stringify()与JSON.parse()的区别 最近做项目,发现JSON.stringify()使用场景真的挺多,我们都知道JSON.stringify()的作用是将 JavaScript 值转换为 JSON 字符串,而JSON.parse()可以将JSON字符串转为一个对象. 简单点说,它们的作用是相对的,我用JSON.stringify()将对象a变成了字符串c,那么我就可以用JSON.parse()将字符串c还原成对象a. let arr = [1,2,3]; JSO

关于JSON.stringify()与JSON.parse()

一.JSON.stringify()与JSON.parse()的区别 JSON.stringify()的作用是将js值转换成JSON字符串,而JSON.parse()是将JSON字符串转换成一个对象.也就是说,如果我们用JSON.stringify()将一个对象变成了字符串,那么使用JSON.parse()将字符串还原成对象. let obj = { name:"song", age:10 }; let changeObj =JSON.stringify(obj); console.l

JSON.stringify()与JSON.parse()区别

一.JSON.stringify()与JSON.parse()的区别 JSON.stringify()的作用是将 JavaScript 对象转换为 JSON 字符串,而JSON.parse()可以将JSON字符串转为一个对象. 简单点说,它们的作用是相对的,我用JSON.stringify()将对象a变成了字符串c,那么我就可以用JSON.parse()将字符串c还原成对象a. let arr = [1,2,3]; JSON.stringify(arr);//'[1,2,3]' typeof J