一文详解JavaScript的转码方式
作者:代码拾荒时间:2026-10-30 23:44:49浏览:171
本文详细解析JavaScript中escape、encodeURI和encodeURIComponent三种转码函数的区别,涵盖不编码字符范围及输出格式。重点讲解表单空格转+号的机制,以及通过双重decodeURIComponent结合unescape的稳健解码策略,解决服务端编码不一致导致的异常问题。
解码是前端开发中较为常见的操作之一。
特殊符号是否编码
- escape函数不编码ASCII字母、数字以及标点符号"@ * _ + - . /",对其余所有字符进行编码处理。
- encodeURI函数不编码ASCII字母、数字以及标点符号"; / ? : @ & = + $ , #",对其余所有字符进行编码。
- encodeURIComponent函数则对所有字符进行编码。
转码结果
- escape的输出结果为字符的Unicode编码值。
- encodeURI的输出结果为符号的UTF-8形式,并在每个字节前添加%符号。
- encodeURIComponent的输出结果同样为符号的UTF-8形式,并在每个字节前添加%符号。
注意事项:
- 需要注意的是,网页在提交表单时,空格会被转换为+字符。服务器在处理数据时,会将+号还原为空格。
注意点
为何解码最好解两次
例如笔者常用的解码方式
function decode(str) {
var r = '';
try {
r = decodeURIComponent(decodeURIComponent(str));
}catch(e){
try {
r = decodeURIComponent(str);
} catch(e) {
try {
r = unescape(str); //Unicode
}catch(e) {
r = str;
}
}
}
return r;
}- 为何捕获异常:实际上decodeURIComponent有时会抛出异常,这属于其固有行为。
- 为何尝试两次编码、一次编码和无编码:这是为了兼容服务端可能进行两次编码、一次编码或无编码的情况。
- 为何最后使用unescape:因为只有该方法能够解析Unicode编码。
到此这篇关于一文详解JavaScript的转码方式的文章就介绍到这了,更多相关JavaScript转码方式内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站!
作者最新文章
JavaScript异步发送HTTP请求时怎么优雅地处理错误
2026-11-05 17:10:44
5款主流JS在线运行工具对比:CodePen、JSFiddle与StackBlitz怎么选
2026-11-05 17:04:04
JavaScript入门书籍避坑:这些书不适合初学者
2026-11-05 16:31:15
JS使用Math.round实现保留两位小数的原理与代码
2026-11-05 15:35:55
JavaScript 原生 Date 对象怎么实现日期加减
2026-11-05 14:30:00
