JavaScript | encodeURI()、decodeURI() 及其组件函数

在 Web 开发中，我们经常需要对 URL 进行编码和解码操作。为了方便，JavaScript 提供了两个非常实用的全局函数：encodeURI()和decodeURI()。此外，还有两个组件函数：encodeURIComponent()和decodeURIComponent()。

encodeURI()函数

encodeURI()函数用于将一个可能包含特殊字符的 URI 进行编码，以便浏览器可以安全地发送请求。

encodeURI('http://www.example.com?one=value1&two=value2');
// 'http://www.example.com?one=value1&two=value2'
encodeURI('http://www.example.com/路径/路径');
// 'http://www.example.com/%E8%B7%AF%E5%BE%84/%E8%B7%AF%E5%BE%84'

在上面的例子中，encodeURI()将 URI 中的中文路径部分编码成了 %E8%B7%AF%E5%BE%84。

需要注意的是，encodeURI()不会对以下字符进行编码： 字母、数字、标点符号和以下特殊字符：- _ . ! ~ * ' ( )。如果需要对这些字符进行编码，请使用encodeURIComponent()函数。

decodeURI()函数

decodeURI()函数用于将被encodeURI()函数编码过的 URI 进行解码。

decodeURI('http://www.example.com/%E8%B7%AF%E5%BE%84/%E8%B7%AF%E5%BE%84');
// 'http://www.example.com/路径/路径'

在上面的例子中，decodeURI()将 URI 中的中文路径部分解码成了路径。

需要注意的是，decodeURI()会对所有被编码过的字符进行解码，包括特殊字符和已经编码过的字符。

encodeURIComponent()函数

encodeURIComponent()函数用于将一个字符串编码成合法的 URI 组件，主要用于对查询字符串进行编码。

encodeURIComponent('http://www.example.com?one=value1&two=value2');
// 'http%3A%2F%2Fwww.example.com%3Fone%3Dvalue1%26two%3Dvalue2'
encodeURIComponent('http://www.example.com/路径/路径');
// 'http%3A%2F%2Fwww.example.com%2F%E8%B7%AF%E5%BE%84%2F%E8%B7%AF%E5%BE%84'

在上面的例子中，encodeURIComponent()将 URL 中的中文路径部分编码成了%E8%B7%AF%E5%BE%84。

需要注意的是，encodeURIComponent()会对所有需要编码的字符进行编码，包括字母、数字、标点符号和以下特殊字符：- _ . ! ~ * ' ( )。

decodeURIComponent()函数

decodeURIComponent()函数用于将被encodeURIComponent()函数编码过的字符串进行解码。

decodeURIComponent('http%3A%2F%2Fwww.example.com%2F%E8%B7%AF%E5%BE%84%2F%E8%B7%AF%E5%BE%84');
// 'http://www.example.com/路径/路径'

在上面的例子中，decodeURIComponent()将 URL 中的中文路径部分解码成了路径。

需要注意的是，decodeURIComponent()会对所有被编码过的字符进行解码，包括特殊字符和已经编码过的字符。