JSON字符生成json对象时的转义问题

JSON字符生成json对象时的转义问题

最近在做新项目的时候,发现从服务器端返回的json格式数据,无法被正确解析。

捣鼓了半天才解决,所以整理了一下查询的文档,写了这篇文章


转义字符(\)对JavaScript中JSON.parse的影响概述

JSON是一个提供了stringify和parse方法的内置对象,前者用于将js对象转化为符合json标准的字符串,后者将符合json标准的字符串转化为js对象,本文为大家介绍下转义字符对JSON.parse方法的影响。

按照ECMA262第五版中的解释,JSON是一个提供了stringify和parse方法的内置对象,前者用于将js对象转化为符合json标准的字符串,后者将符合json标准的字符串转化为js对象。

一般来说在JSON.parse的参数包含转移字符的时候会遇到两次转义的问题,其实第一次是字符串本身的转义,第二次是将真正转为js对象的转义。

举例如下:

例子一:将字符串’{“a”:”b”,”b”:”\\“}’传递给JSON.parse

首先解析器提取单引号括起来的字符串时认为第一个\转义第二个\ 第三个\转义第四个\,也就是说实际可输出字符串是{"a":"b","b":"\\"}(可通过console.log(‘{“a”:”b”,”b”:”\\“}’)验证),

之后正式转为js对象的时候还有一次转义,也就是实际输出字符转中的第一个\转义第二个\(此时只有两个\)。所以

1
console.log(JSON.parse('{"a":"b","b":"\\\\"}') );

输出结果为

1
Object {a: "b", b: "\"},

也就是说实际显示的数据为一个\(实际可输出一个\说明在此之前还有一个\)。

例子二:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var obj = {
a : "b",
b : "\\",
c : {
b : "\\",
a : {
b : "\\"
}
}
};
var json_str = JSON.stringify(obj);
console.log( JSON.stringify(obj) );
console.dir(JSON.parse(json_str));
console.dir(JSON.parse('{"a":"b","b":"\\\\","c":{"b":"\\\\","a":{"b":"\\\\"}}}'));

输出结果如下:

1
2
3
4
5
{"a":"b","b":"\\","c":{"b":"\\","a":{"b":"\\"}}}
Object {a: "b", b: "\", c: Object}
Object {a: "b", b: "\", c: Object}

根据转义规则,实际输出一个\在这个\之前必定有一个\。所以如上第一行输出按照书写来说为'{"a":"b","b":"\\\\","c":{"b":"\\\\","a":{"b":"\\\\"}}}',
可通过第三条输出来验证。

总结,如果想在js对象中出现一个\,需要在json字符串中出现四个\ 。

对于其他的其他的特殊字符

  1. 双引号",如果正确出现双引号应为\\\"
  2. \n,如想想出现正确的换行需要json字符串中是\\n,其实是先对\n中的\转义,n变成了普通字符,在解析为js对象的时候n与之前的\(只有一个\了)被解释为换行。如下的两个与此类似。
  3. \r,\r
  4. \t,\t

特殊字符导致json字符串转换成json对象出错

只需要通过批量替换,将特殊字符替换为转义字符即可。

1
2
3
4
5
return str.replace(/<[^>]+>/g, '')
.replace(/\'/g, "\\\'")
.replace(/\"/g, '\\\"')
.replace("\\", "\\\\")
.replace(/[\n\t\s\r]+/g, '')

坚持原创技术分享,您的支持将鼓励我继续创作!