4.encodeURI、encodeURIComponent、decodeURI、decodeURIComponent的区别

一、前言

统一资源标识符，或叫做 URI，是用来标识互联网上的资源（例如，网页或文件）和怎样访问这些资源的传输协议（例如，HTTP 或 FTP）的字符串。除了encodeURI、encodeURIComponent、decodeURI、decodeURIComponent四个用来编码和解码 URI 的函数之外 ECMAScript 语言自身不提供任何使用 URL 的支持。

二、URI组成形式

一个 URI 是由组件分隔符分割的组件序列组成。其一般形式是：

Scheme : First / Second ; Third ? Fourth

其中斜体的名字代表组件；“:”, “/”, “;”，“?”是当作分隔符的保留字符

三、区别

encodeURI 和decodeURI 函数操作的是完整的 URI；这俩函数假定 URI 中的任何保留字符都有特殊意义，所有不会编码它们。

encodeURIComponent和encodeURIComponent函数操作的是组成 URI 的个别组件；这俩函数假定任何保留字符都代表普通文本，所以必须编码它们，所以它们（保留字符）出现在一个完整 URI 的组件里面时不会被解释成保留字符了。

var uri = "http://xx/#/y?a=1%&b=我";
var string1 = encodeURI(uri);
var string2 = encodeURIComponent(uri);
console.log(string1);//http://xx/#/y?a=1%25&b=%E6%88%91
console.log(string2);//http%3A%2F%2Fxx%2F%23%2Fy%3Fa%3D1%25%26b%3D%E6%88%91

这也正是可以对整个URI使用encodeURI()，而只能对附加在现有URI后面的字符串使用encodeURIComponent()的原因所在。一般来说,我们使用encodeURIComponent()方法的时候要比使用encodeURI()更多,因为在实践中更常见的是对查询字符串参数而不是对基础URL进行编码.