JSON.parse()与JSON.stringify()的用法,以及eval()和new Function

JSON.parse()

1、我们可以使用 JSON.parse() 方法将数据转换为 JavaScript 对象。

语法

JSON.parse(text[, reviver])

参数说明:

text:必需, 一个有效的 JSON 字符串。
reviver: 可选,一个转换结果的函数, 将为对象的每个成员调用此函数。

2、JSON 解析实例

使用 JSON.parse 的 reviver 函数时一定要注意遍历到最后的顶层对象 key 为 "",需要返回 value。不然报错

var json = '{"name":"Harvy", "age":36, "gender":"male"}';
var person = JSON.parse(json, function (key, value) {
    if(key != "")
        return "<font color=\"blue\">"+value+"</font>";
    else
        return value;
});

JSON 不能存储 Date 对象。// Sat Dec 14 2013 08:00:00 GMT+0800 (中国标准时间)
如果你需要存储 Date 对象,需要将其转换为字符串。// 2013-12-14
之后再将字符串转换为 Date 对象。// new Date(“2013-12-14”);

我们可以启用 JSON.parse 的第二个参数 reviver,一个转换结果的函数,对象的每个成员调用此函数。

实例

var text = '{ "name":"Runoob", "initDate":"2013-12-14", "site":"www.runoob.com"}'; 
var obj = JSON.parse(text, function (key, value) { 
if (key == "initDate") {
      return new Date(value);//将日期字符串转换为 Date 对象
 } else { 
return value; 
}
}); 
//Sat Dec 14 2013 08:00:00 GMT+0800 (中国标准时间)
document.getElementById("demo").innerHTML = obj.name + "创建日期:" + obj.initDate;

3、解析函数

JSON 不允许包含函数,但你可以将函数作为字符串存储,之后再将函数字符串用eval解析。

实例

var text = '{ "name":"Runoob", "alexa":"function () {return 10000;}", "site":"www.runoob.com"}'; 
var obj = JSON.parse(text); 
obj.alexa = eval("(" + obj.alexa + ")"); //用eval解析函数字符串
document.getElementById("demo").innerHTML = obj.name + " Alexa 排名:" + obj.alexa();

4、eval()

除了JSON.parse(),以下二种方法也可以将json字符串转化为json 对象。

var str1 = '{ "name": "deyuyi", "sex": "man" }';
console.log(eval("("+str1+")"));
console.log((new Function("","return "+str1))());
//str1 = { "name": "deyuyi", "sex": "man" }

Eval

由于json是以”{}”的方式来开始以及结束的,在JS中,{}会被当成一个语句块来处理,加上圆括号的目的是迫使eval函数在处理JavaScript代码的时候强制将括号内的表达式(expression)转化为对象,而不是作为语句(statement)来执行。

console.log(eval("{}"));// return undefined
console.log(eval("({})"));// return object[Object]

将age的值换成了Javascript代码,eval依然可以解析,假如有人恶意修改这个代码,那么就会造成严重后果。
//例如:

var jsonData = '{"student" : [{"name":"鸣人","age":17}, {"name":"小樱","age":alert("hehe")},{"name":"佐助","age":17}]}';

//先弹出一个提示框输出hehe的字符串~

console.log(eval("("+jsonData+")"));

但JSON.parse会报错。显示错误信息为当前字符串不符合json格式~即JSON.parse()方法会检查需要转换的字符串是否符合json格式~

相比较而言eval方法是很危险的~特别是当涉及到第三方时我们需要确保传给eval的参数是我们可以控制的~
不然里面插入比如window.location~指向一个恶意的连接~那就不好了
从这个层面讲~还是推荐使用JSON.parse来实现json格式字符串的解析。

//会报错~显示错误信息为当前字符串不符合json格式

console.log(JSON.parse(jsonData));

JSON.stringify()

我们可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串。

1、语法

JSON.stringify(value[, replacer[, space]])

参数说明:

value:
必需, 一个有效的 JSON 对象。
replacer:
可选。用于转换结果的函数或数组。
如果 replacer 为函数,则 JSON.stringify 将调用该函数,并传入每个成员的键和值。使用返回值而不是原始值。如果此函数返回 undefined,则排除成员。根对象的键是一个空字符串:""。
如果 replacer 是一个数组,则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。当 value 参数也为数组时,将忽略 replacer 数组。
space:
可选,文本添加缩进、空格和换行符,如果 space 是一个数字,则返回值文本在每个级别缩进指定数目的空格,如果 space 大于 10,则文本缩进 10 个空格。space 有可以使用非数字,如:t。

2、JavaScript 对象转换

实例

var obj = { "name":"runoob", "alexa":10000, "site":"www.runoob.com"}; 
document.write(obj);//[object Object] 
var myJSON = JSON.stringify(obj);
document.write(myJSON );
//输出字符串{"name":"runoob","alexa":10000,"site":"www.runoob.com"}

3、JavaScript 数组转换

实例

var arr = [ "Google", "Runoob", "Taobao", "Facebook" ]; 
document.write(arr);//Google,Runoob,Taobao,Facebook
var myJSON = JSON.stringify(arr);
document.write(myJSON );// [ "Google", "Runoob", "Taobao", "Facebook" ]

4、将Date 对象转化为字符串

JSON 不能存储 Date 对象。
JSON.stringify() 会将所有日期转换为字符串。

实例

var obj = { "name":"Runoob", "initDate":new Date(), "site":"www.runoob.com"};
var myJSON = JSON.stringify(obj.initDate); 
document.write(myJSON );//"2018-11-08T03:00:40.443Z"

5、解析函数
JSON 不允许包含函数,JSON.stringify() 会删除 JavaScript 对象的函数,包括 key 和 value。

实例

var obj = { "name":"Runoob", "alexa":function () {return 10000;}, "site":"www.runoob.com"}; 
var myJSON = JSON.stringify(obj);
document.write(myJSON );//{"name":"Runoob","site":"www.runoob.com"}

我们可以在执行 JSON.stringify() 函数前将函数转换为字符串来避免以上问题的发生:

实例

var obj = { "name":"Runoob", "alexa":function () {return 10000;}, "site":"www.runoob.com"}; 
obj.alexa = obj.alexa.toString(); //将函数转换为字符串
var myJSON = JSON.stringify(obj);
//{"name":"Runoob","alexa":"function () {return 10000;}","site":"www.runoob.com"}
 document.write(myJSON );

不建议在 JSON 中使用函数。

<think>好的,用户的问题是关于JavaScripteval方法功能相反的方法,也就是将数据转换为字符串或者从字符串安全解析的方法,比如JSON.parseJSON.stringify。我需要先确认用户的需求,他们可能希望在不使用eval的情况下安全地处理数据序列化反序列化。 首先,用户提到的eval的对立方法,应该是指将对象转换为字符串(序列化)以及从字符串解析回对象(反序列化)。JSON.stringifyJSON.parse正是这样的方法,它们可以替代eval在某些场景下的使用,比如处理JSON数据时更安全,因为eval会执行任何传入的代码,存在安全风险。 接下来,我需要验证这两个方法是否符合用户的需求。JSON.stringify可以将JavaScript对象转换为JSON字符串,而JSON.parse则可以将有效的JSON字符串转换回JavaScript对象。eval不同,JSON.parse只能解析JSON格式的字符串,不会执行任意的JavaScript代码,因此更安全。例如,使用eval解析用户输入的字符串可能导致XSS攻击,而JSON.parse则不会有这个问题。 然后,考虑用户可能的应用场景,比如数据传输、本地存储或者配置读取。在这些场景中,使用JSON的方法更安全可靠。例如,当从服务器获取数据时,通常会使用JSON.parse来解析响应数据,而不是用eval,以避免潜在的安全问题。 同时,需要指出两者的局限性。JSON.stringify无法处理函数、undefined等非JSON安全的数据类型,而eval可以执行任何JavaScript代码,包括函数。因此,如果用户需要序列化包含函数或循环引用的对象,可能需要其他库,如lodash的_.cloneDeep或自定义解决方案,但这些不在标准JSON方法支持范围内。 另外,用户可能想知道除了JSON之外是否有其他方法,比如其他序列化格式或库,但核心的替代方法还是JSON的方法。因此,回答中应强调JSON.parseJSON.stringify作为主要替代方案,并说明它们的适用场景限制。 最后,确保回答结构清晰,分点说明,并附上相关问题,帮助用户进一步理解。同时检查引用是否正确,引用内容是否相关。例如,引用[2]提到了数组的instanceof检查,可能数据类型验证相关,但可能不直接相关,因此可能需要调整引用部分或说明相关性。</think>在JavaScript中,`eval()`的功能对立方法需要同时解决两个方向的操作:序列化(将对象转为字符串)安全解析(将字符串转为对象)。以下是标准解决方案推荐实践: ### 一、核心替代方法 1. **序列化:`JSON.stringify()`** - 将JavaScript对象转换为符合JSON标准的字符串 - 示例:`const str = JSON.stringify({name: "Alice", age: 25})` - 限制:无法处理函数/循环引用等非JSON安全类型[^2] 2. **反序列化:`JSON.parse()`** - 将JSON字符串转换为JavaScript对象 - 示例:`const obj = JSON.parse('{"name":"Bob","score":90}')` - 安全优势:相比`eval()`不会执行任意代码 ### 二、特殊场景处理 1. **函数序列化**: ```javascript // 自定义序列化 const funcStr = myFunction.toString(); // 反序列化时需通过new Function重建 const reconstructed = new Function('return ' + funcStr)(); ``` 2. **安全沙箱**: 当必须执行动态代码时,推荐使用严格限制的沙箱环境: ```javascript const safeEval = code => Function('"use strict";return (' + code + ')')(); console.log(safeEval('2+2')); // 4 ``` ### 三、性能对比 | 方法 | 执行速度 | 安全性 | 数据类型支持 | |-------------------|----------|--------|--------------| | `eval()` | 快 | 危险 | 全部 | | `JSON.parse()` | 较快 | 安全 | JSON标准类型 | | `new Function()` | 中等 | 可控 | 有限 | ### 四、最佳实践 1. 优先使用`JSON`方法处理配置数据 2. 用户输入必须经过严格过滤才能使用动态执行方法 3. 使用`try/catch`包裹反序列化操作: ```javascript try { const data = JSON.parse(userInput); } catch(e) { console.error('Invalid JSON格式'); } ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值