前端：JS对URL进行转码与解码

1. escape 和 unescape（不常用）

escape：对字符串进行编码

unescape：对由 escape() 编码的字符串进行解码

规则：escape() 函数可对字符串进行编码，这样就可以在所有的计算机上读取该字符串。

除了ASCII字母、数字、标点符号”@ * _ + - . /“ 等0-255以外，所有的空格符、标点符号、特殊字符以及非ASCII字符都将被转化成%xx格式的字符编码，比如，空格符对应的编码是%20。

escape()不会编码字符有69个：*，+，-，.，/，@，_，0-9，a-z，A-Z。

注：

1. escape()用来对某个字符串进行编码的，不能直接用于url编码，尽管url也是个字符串。所以如果你需要编码整个URL，那么用encodeURI()。
2. ECMAScript v3 反对使用escape()方法，应用使用 decodeURI() 和 decodeURIComponent()替代它

var url = 'http://www.baidu.com/login?name=张三&age=18'
console.log(escape(url))   //http%3A//www.baidu.com/login%3Fname%3D%u5F20%u4E09%26age%3D18

2. encodeURI 和 decodeURI

encodeURI：把字符串编码为 URI

decodeURI：解码某个编码的 URI

规则：encodeURI() 函数可把字符串作为 URI 进行编码。

结果：输出utf-8形式，并且在每个字节前加上%。

该方法的目的是对 URI 进行完整的编码，因此对在 URI 中具有特殊含义的 ASCII 标点符号，encodeURI()函数是不会进行转义的。

encodeURI()不会编码字符有82个：!，#，$，&，’，(，)，*，+，,，-，.，/，:，;，=，?，@，_，~，0-9，a-z，A-Z

注：

1. encodeURI()用于整个url编码；
2. 如果 URI 组件中含有分隔符，比如 ? 和 #，则应当使用encodeURIComponent()方法分别对各组件进行编码。

var url = 'http://www.baidu.com/login.html/my name'
console.log(encodeURI(url)) //http://www.baidu.com/login?name=%E5%BC%A0%E4%B8%89&age=18

3. encodeURIComponent 和 decodeURIComponent

encodeURIComponent：把字符串编码为 URI 组件

decodeURIComponent：解码某个编码的 URI

规则：encodeURIComponent() 函数可把字符串作为 URI 组件进行编码。

结果：输出utf-8形式，并且在每个字节前加上%。

与encodeURI()的区别是，它用于对URL的组成部分（如查询参数、路径等）进行个别编码，而不用于对整个URL进行编码。

encodeURIComponent()不会编码字符有71个：!， ‘，(，)，*，-，.，_，~，0-9，a-z，A-Z

encodeURIComponent比encodeURI编码的范围更大，即 @ # $ & = : / , ; ? +，这些在encodeURI()中不被编码的符号，在encodeURIComponent()中统统会被编码。

注：

1. 传递参数时需要使用encodeURIComponent()，这样组合的url才不会被#等特殊字符截断。

var url = 'http://www.baidu.com/login?name=张三&age=18'
console.log(encodeURIComponent(url)) //http%3A%2F%2Fwww.baidu.com%2Flogin%3Fname%3D%E5%BC%A0%E4%B8%89%26age%3D18

4.三者区别

1. 如果只是编码字符串，不和URL有关系，那么用escape()。当然该方法已经不推荐使用，所以不深究；
2. encodeURL()用于编码整个URL；
3. encodeURIComponent()用于编码url中的查询参数或路径等，若参数为url,还是相当于参数，用encodeURIComponent()。

var url = "http://localhost:4000/login?id=1&remark=" 
var paramsUrl = "http://www.baidu.com/login?name=张三&age=18";
//paramsUrl 应该使用encodeURIComponent()进行转码　　
console.log(encodeURI(url) + encodeURIComponent(paramsUrl))
//http://localhost:4000/login?id=1&remark=http%3A%2F%2Fwww.baidu.com%2Flogin%3Fname%3D%E5%BC%A0%E4%B8%89%26age%3D18
console.log(encodeURIComponent(url+paramsUrl)) 
//http%3A%2F%2Flocalhost%3A4000%2Flogin%3Fid%3D1%26remark%3Dhttp%3A%2F%2Fwww.baidu.com%2Flogin%3Fname%3D%E5%BC%A0%E4%B8%89%26age%3D18

5.replace() +正则表达式

方法：str.replace(/%/g,”%25”)

正则可以替换掉全部匹配的字符(g为全局标志)。

常用的符号url编码如下：

符号	正则特殊转义	解释	转义
#	无	用来标志特定的文档位置	%23
%	无	对特殊字符进行编码	%25
&	无	分隔不同的变量值对	%26
+	\ +（复制时，去掉中间的空格）	在变量值中表示空格	%2B
/	\ \（复制时，去掉中间的空格）	表示目录路径	%2F
\	\ \（复制时，去掉中间的空格）	表示目录路径	%5C
=	无	用来连接键和值	%3D
?	\ ?（复制时，去掉中间的空格）	表示查询字符串的开始	%3F
空格	无	空格	%20
.	\ .（复制时，去掉中间的空格）若是没有\ ，则整个字符串会被全部替换	句号	%2E
:	无	冒号	%3A
‘	无	单引号	%27
“	无	双引号	%22