js字符编码解码函数

js对文字进行编码涉及3个函数:escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decodeURIComponent。

URI方法encodeURI、encodeURIComponent()、decodeURI()、decodeURIComponent()代替了BOM的escape()和unescape()方法。URI方法更可取,因为它们对所有Unicode符号编码,而BOM方法只能对ASCII符号正确编码。尽量避免使用escape()和unescape()方法。<摘自 javascript advanced book>

unescape 方法
返回值
已编码的 string 的副本。其中某些字符被替换成了十六进制的转义序列。
说明
该方法不会对 ASCII 字母和数字进行编码,也不会对下面这些 ASCII 标点符号进行编码(共7个): * @ - _ + . / 。其他所有的字符都会被转义序列替换,%xx 十六进制形式编码,字符值大于 255 的以 %uxxxx 格式(Unicode 字符)。注意 unescape 方法不应用于解码“统一资源标识符”(URI)。请改用 decodeURI 和 decodeURIComponent 方法。
提示和注释
提示:可以使用 unescape() 对 escape() 编码的字符串进行解码。
注释:ECMAScript v3 反对使用该方法,应用使用 decodeURI() 和 decodeURIComponent() 替代它。

decodeURI 方法
说明
该方法不会对 ASCII 字母和数字进行编码,也不会对这些 ASCII 标点符号进行编码: - _ . ! ~ * ' ( ) 。
该方法的目的是对 URI 进行完整的编码,因此对以下在 URI 中具有特殊含义的 ASCII 标点符号,encodeURI() 函数是不会进行转义的:;/?:@&=+$,#

decodeURIComponent 方法
说明
该方法不会对 ASCII 字母和数字进行编码,也不会对这些 ASCII 标点符号进行编码: - _ . ! ~ * ' ( ) 。
其他字符(比如 :;/?:@&=+$,# 这些用于分隔 URI 组件的标点符号),都是由一个或多个十六进制的转义序列替换的。
提示和注释
提示:请注意 encodeURIComponent() 函数 与 encodeURI() 函数的区别之处,前者假定它的参数是 URI 的一部分(比如协议、主机名、路径或查询字符串)。因此 encodeURIComponent() 函数将转义用于分隔 URI 各个部分的标点符号。


总结:

1、传递参数时需要使用encodeURIComponent,这样组合的url才不会被#、&等分割URI各部分的字符截断。                            
例如:<script language="javascript">document.write('<a href="http://passport.baidu.com/?logout&aid=7&u='+encodeURIComponent("http://cang.baidu.com/bruce42")+'">退出</a>');</script>

2、进行url跳转时可以整体使用encodeURI
例如:Location.href=encodeURI(http://cang.baidu.com/do/s?word=百度&ct=21);

3、最多使用的为encodeURIComponent,它是将中文、韩文等特殊字符转换成utf-8格式的url编码,所以如果给后台传递参数需要使用encodeURIComponent时需要后台解码对utf-8支持

互解测试


escape采用unicode编码,%uxxxx(2个字节),URI采用utf-8编码(中文3个字节)。decodeURI不解码的字符比decodeURIComponent多,因此用encodeURIComponent编码的不能用decodeURI解码,但用encodeURI编码的可以用decodeURICompontent解码,但最好还是别混用。

<meta charset="utf-8">
<script>
    var str='http://www.test.com.cn/My first/?c=con/test&remark=/@+-_.*#hot';
    //var str='http://www.test.com.cn/My first/?c=con/test&remark=测试#hot';

    console.log('-----encodeURIComponent、encodeURI、escape------');
    console.log(encodeURIComponent(str));
    console.log(encodeURI(str));
    console.log(escape(str));

    console.log('---------decodeURI----------');
    console.log(decodeURI (encodeURIComponent(str)));
    console.log(decodeURI (encodeURI(str)));
    console.log(decodeURI(escape(str)));    //含有汉字URIError

    console.log('---------decodeURIComponent----------');
    console.log(decodeURIComponent(encodeURIComponent(str)));
    console.log(decodeURIComponent(encodeURI(str)));
    console.log(decodeURIComponent(escape(str)));   //含有汉字URIError

    console.log('---------unescape----------');
    console.log(unescape(encodeURIComponent(str)));
    console.log(unescape(encodeURI(str)));
    console.log(unescape(escape(str)));
</script>


参考:

W3C school

javascript中escape()、unescape()、encodeURI()、encodeURIComponent()、decodeURI()、decodeURIComponent()比较

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值