JavaScript decodeURIComponent() 函数

JavaScript decodeURIComponent() 语法

decodeURIComponent() 是 JavaScript 的一个全局函数，它用于对已编码 URI 的某个部分（如查询字符串）进行解码。

语法：

decodeURIComponent(uri)

说明：

decodeURIComponent() 函数接收单个参数。

uri（必选）：一个已编码的 URI 字符串。

decodeURIComponent() 函数会解码所有转义序列，包括 URI 保留字符串：

; / ? : @ & = + $ , #

注意:

decodeURIComponent() 是一个全局函数（顶层函数），我们可以直接调用而无需创建实例。
如果编码时使用的是 encodeURI()，那么在解码时应该使用 decodeURI()。如果编码时使用的是 encodeURIComponent()，那么解码时应该使用 decodeURIComponent()。如果没有使用对应的函数，则会导致解析错误。

JavaScript decodeURIComponent() 摘要

属于	JavaScript 全局对象
使用频率	低
官方文档	查看
MDN	查看

JavaScript decodeURIComponent() 示例

接下来，我们通过一个简单的例子来讲解一下 JavaScript decodeURIComponent() 函数是如何使用的。

示例 1：decodeURIComponent() 基本用法

运行代码

const str1 = "%3Fkeywords%3D%E7%BB%BF%E5%8F%B6%E7%BD%91";
console.log(decodeURIComponent(str1));

const str2 = "%3Fkeywords%3D%CF%80%CE%B8%CF%86%26charset%3Dutf8";
console.log(decodeURIComponent(str2));

运行结果如下。

?keywords=绿叶网
?keywords=πθφ&charset=utf8

decodeURI() 与 decodeURIComponent() 的区别

decodeURI() 与 decodeURIComponent() 这两个函数都用于对 URI 进行解码，但是它们之间存在以下的区别。

decodeURI()：不会对属于 URI 语法的字符（即 URI 保留字符）进行解码，包括 /、:、？、= 等。比如 "%3Fkeywords%3Dpython%26charset%3Dutf8" 解码之后还是它本身。
decodeURIComponent()：会对属于 URI 语法的字符进行解码，编码得更加彻底。比如 "%3Fkeywords%3Dpython%26charset%3Dutf8" 解码之后会变成 "?keywords=python&charset=utf8"。

示例 2：decodeURI() vs decodeURIComponent()

运行代码

const str = "%3Fkeywords%3Dpython%26charset%3Dutf8";

console.log(decodeURI(str));
console.log(decodeURIComponent(str));

运行结果如下。

%3Fkeywords%3Dpython%26charset%3Dutf8
?keywords=python&charset=utf8

分析：

再次强调一下：如果想要解码 “整个 URI”，我们应该使用 decodeURI() 函数。如果想要解码 “URI 的某个部分（如查询字符串）”，我们应该使用 decodeURIComponent() 函数。