【Javascript】encodeURI、encodeURIComponent、decodeURI、decodeURIComponent

一、encodeURI()

介绍

encodeURI() 函数通过将特定字符的每个实例替换为一个、两个、三或四转义序列来对统一资源标识符 (URI) 进行编码

使用场景:当你需要对整个URL进行编码时方便使用,因为它不会编码URL组成部分中需要存在的特殊字符

语法

encodeURI(URI)

参数:
URI: 一个完整的 URI

返回值:
一个新字符串,表示提供的字符串编码为统一资源标识符 (URI)

描述

假定一个 URI 是完整的 URI,那么无需对那些保留的并且在 URI 中有特殊意思的字符进行编码。
encodeURI 会替换所有的字符,但不包括以下字符,即使它们具有适当的 UTF-8 转义序列:

类型包含
保留字符; , / ? : @ & = + $
非转义的字符字母 数字 - _ . ! ~ * ' ( )
数字符号#

示例

var uri = 'https://www.example.com/测试?query=测试&another=值';
var encodedUri = encodeURI(uri);
console.log(encodedUri); 
// https://www.example.com/%E6%B5%8B%E8%AF%95?query=%E6%B5%8B%E8%AF%95&another=%E5%80%BC

二、encodeURIComponent()

介绍

encodeURIComponent() 函数通过将特定字符的每个实例替换成代表字符的 UTF-8 编码的一个、两个、三个或四个转义序列来编码 URI

与 encodeURI() 相比,此函数会编码更多的字符,包括 URI 语法的一部分。

使用场景: 当你需要对URL的某个部分(比如查询字符串的参数)进行编码时使用。因为它会编码几乎所有的字符,使得编码后的字符串可以安全地作为URL参数

语法

encodeURIComponent(str)

参数:
uriComponent
一个 string、number、boolean、null,undefined 或者任何 object。在编码之前,uriComponent 参数会被转化为字符串

返回值:
原字串作为 URI 组成部分被被编码后的新字符串。

描述

encodeURIComponent 转义除了如下所示外的所有字符:

不转义的字符:
    A-Z a-z 0-9 - _ . ! ~ * ' ( )

encodeURIComponent() 和 encodeURI 不同点

var set1 = ";,/?:@&=+$"; // 保留字符
var set2 = "-_.!~*'()"; // 不转义字符
var set3 = "#"; // 数字标志
var set4 = "ABC abc 123"; // 字母数字字符和空格

console.log(encodeURI(set1)); // ;,/?:@&=+$
console.log(encodeURI(set2)); // -_.!~*'()
console.log(encodeURI(set3)); // #
console.log(encodeURI(set4)); // ABC%20abc%20123 (空格被编码为 %20)

console.log(encodeURIComponent(set1)); // %3B%2C%2F%3F%3A%40%26%3D%2B%24
console.log(encodeURIComponent(set2)); // -_.!~*'()
console.log(encodeURIComponent(set3)); // %23
console.log(encodeURIComponent(set4)); // ABC%20abc%20123 (空格被编码为 %20)

三、decodeURI()

decodeURI() 函数能解码由encodeURI 创建或其他流程得到的统一资源标识符(URI)

四、decodeURIComponent()

decodeURIComponent() 方法用于解码由 encodeURIComponent 方法或者其他类似方法编码的部分统一资源标识符(URI)。

  • 15
    点赞
  • 25
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
JavaScript中,encodeURI()函数用于将URI字符串转换为UTF-8编码格式的escape格式字符串。这个函数会编码除了以下字符之外的所有字符:! @ # $ & ( ) = : / ; ? + '。\[1\]例如,如果你想编码一个带有特殊字符(比如中文)的URI,你可以使用encodeURI()函数。例如,如果原始URI是"http://www.365mini.com/page/tag/中国近代史的前车之鉴",那么使用encodeURI()函数后,编码后的URI将变为"http://www.365mini.com/page/tag/%E4%B8%AD%E5%9B%BD%E8%BF%91%E4%BB%A3%E5%8F%B2%E7%9A%84%E5%89%8D%E8%BD%A6%E4%B9%8B%E9%89%B4"。\[1\] 另外,JavaScript还提供了encodeURIComponent()函数,用于将URI作为请求参数传递时编码所有的字符。encodeURIComponent()函数会编码所有字符,包括特殊字符和保留字符。\[1\]例如,如果你想编码一个URL参数,比如将参数值中的中文字符编码,你可以使用encodeURIComponent()函数。例如,如果原始URL是"http://localhost:8080/pro?a=1&b=张三&c=aaa",那么使用encodeURIComponent()函数后,编码后的URL将变为"http://localhost:8080/pro?a=1&b=%E5%BC%A0%E4%B8%89&c=aaa"。\[2\] 需要注意的是,encodeURI()和encodeURIComponent()函数都有对应的解码函数,分别是decodeURI()和decodeURIComponent()。这些函数可以用来解码已经编码的URI字符串。\[1\] #### 引用[.reference_title] - *1* [JavaScript encodeURI() 函数详解](https://blog.csdn.net/zyl3133873776/article/details/52022462)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* *3* [js使用encodeURIdecodeURI转码和解码](https://blog.csdn.net/xingchen678/article/details/107784720)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^control_2,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值