这周在开发后端系统的时候，遇到了需要将后端传过来的转义字符进行转义然后再渲染到html中，因为之前也没有遇到过，所以研究了研究，记录一下。
记得上大学时候学习C语言就有提到过转义字符，比如\n表示回车，\t表示水平制表符等等。其实所有编程语言都有转移字符，转移字符出现的原因基本上就两点：
- 使用转义字符来表示字符集中定义的字符，比如ASCll里面的控制字符及回车换行等字符，这些字符都没有现成的文字代号。所以只能用转义字符来表示
- 某一些特定的字符在编辑语言中被定义为特殊用途的字符。这些字符由于被定义为特殊用途，它们失去了原有的意义。例如在html中，
<被HTML定义为标签的开始，所以当我们转入<时，HTML就会把它当作为开始，而不是当作一个<来看待
由于不同的语言关键字不同，例如在一般的编程语言中，"会被当作代码的一部分，但是在html中它会被直接渲染，再如常见的编程语言中\n表示回车，但是在html中<br>表示回车
这就导致了如果后端返回的是想要在前端展示的一段代码，则必然会包含转移字符，而这些转义字符html是无法识别的
解决——js转换转义字符
由于html与js所用的转义字符不同所以导致了无法正常渲染，所以需要在js中先将转义字符转换，然后在渲染到html中，在js中转换转义字符常用的有两种方法：
- eval()
- JSON.parse()
eval()函数会将传入的字符串当做JavaScript代码进行执行。这个函数一般是不推荐使用的，因为他执行的代码拥有着执行者的权利。如果用eval()运行的字符串代码被恶意方操控修改,可能会利用最终在用户机器上运行恶意方部署的恶意代码，并导致失去对网页或者扩展程序的权限。所以这种方法是不推荐的
JSON.parse()方法用来解析JSON字符串，构造由字符串描述的JavaScript值或对象，经过这个转换，由于代码的执行，转义字符会被自动转义，从而拿到我们想要的效果，但是使用这个方法解析的时候需要注意一点：必须组合成JSON字符串，所以我们需要将拿到的数据进行包装：
decodeValueFun(value) {
const decodeValue = JSON.parse(`{"key":${value}}`);
return decodeValue.key;
},
这样返回的数据就是经过转义的数据了
疑问🤔️
在实际测试的时候发现，如果将后端返回的数据直接贴入前端js代码中然后去直接展示到页面中，转义字符会被自动识别，但是如果将后端返回的字符串直接渲染到html页面中，则字符串中的转义字符直接被当作字符串处理，这说明在js使用字符串的时候已经将转义符自动转义，不知道这个是什么原因。
附：
常见的HTML转义字符
| 字符 | 十进制 | 转义字符 |
|---|---|---|
| " | " |
" |
| & | & |
& |
| < | < |
< |
| > | > |
> |
| 不断开空格(non-breaking space) |   |
|
更多html转义字符见链接：http://tool.oschina.net/commons?type=2
常见的编程语言的字符表
| 转义字符 | 意义 | ASCII码值（十进制） |
|---|---|---|
\a |
响铃(BEL) | 007 |
\b |
退格(BS) ，将当前位置移到前一列 | 008 |
\f |
换页(FF)，将当前位置移到下页开头 | 012 |
\n |
换行(LF) ，将当前位置移到下一行开头 | 010 |
\r |
回车(CR) ，将当前位置移到本行开头 | 013 |
\t |
水平制表(HT) （跳到下一个TAB位置） | 009 |
\v |
垂直制表(VT) | 011 |
\\ |
代表一个反斜线字符''' | 092 |
\' |
代表一个单引号（撇号）字符 | 039 |
\" |
代表一个双引号字符 | 034 |
\? |
代表一个问号 | 063 |
\0 |
空字符(NULL) | 000 |
\ooo |
1到3位八进制数所代表的任意字符 | 三位八进制 |
\xff |
1到2位十六进制所代表的任意字符 | 二位十六进制 |
