`

中文化和国际化问题权威解析之七:JS中的escape、encodeURI、encodeURIComponent解惑

 
阅读更多

面一篇文档《中文化和国际化问题权威解析之五:URL编码/Misc 》主要是从服务端、浏览器两个角度来看待URL编码;除此之外,我们还可能在客户端执行一些js脚本来进行URL编码,与此相关的最主要的三个js function为:
escape(): 采用ISO Latin字符集对指定的字符串进行编码。所有的空格符、标点符号、特殊字符以及其他非ASCII字符都将被转化成%xx格式的字符编码(xx等于该字符 在字符集表里面的编码的16进制数字)。比如,空格符对应的编码是%20。unescape方法与此相反。不会被此方法编码的字符: @ * / +
encodeURI():把URI字符串采用UTF-8编码格式转化成escape格式的字符串。不会被此方法编码的字符:! @ # $& * ( ) = : / ; ? + '
encodeURIComponent(): 把URI字符串采用UTF-8编码格式转化成escape格式的字符串。与encodeURI()相比,这个方法将对更多的字符进行编码,比如 / 等字符。所以如果字符串里面包含了URI的几个部分的话,不能用这个方法来进行编码,否则 / 字符被编码之后URL将显示错误。不会被此方法编码的字符:! * ( )

这是目前互联网上随处可见的对这3个function的解释,很多文章里面还附带了英文便于对照;对escape还有一些文档这么解释:直接使用"%"加字符的Unicode内码来表示字符;
比如:escape("我是中国人") = %u6211%u662F%u4E2D%u56FD%u4EBA
这几句话MS很简单、明了,但细思之下发现有几点疑惑,比如:

  • 1. Escape中ISO Latin指什么,是ISO-5899-1?但怎么会另一种解释中说是Unicode内码?
  • 2. 三个function的编码结果是否会依赖于html内部的content-type或meta中的charset?

于是,我用如下这段html代码进行测试,文件格式为ANSI/ASCII;

  1. < head >
  2. < meta http-equiv = content -type content = "text/html;charset=XXX" >
  3. </ head >
  4. < script language = 'javascript' >
  5. document.write(escape('/我爱')+'< br /> ');
  6. document.write(encodeURI('/我爱')+'< br /> ');
  7. document.write(encodeURIComponent('/我爱')+'< br /> ');
  8. document.write(escape('http://mall.alisoft.com/我爱')+'< br /> ');
  9. document.write(encodeURI('http://mall.alisoft.com/我爱')+'< br /> ');
  10. document.write(encodeURIComponent('http://mall.alisoft.com/我爱')+'< br /> ');
  11. </ script >

将代码中charset设置为不同的字符编码,得到的结果却是完全不一样!
测试结果为:

 

字符编码 测试结果
charset=UTF-8 /%u0392%3F%3F
/%CE%92??
%2F%CE%92%3F%3F
http%3A//mall.alisoft.com/%u0392%3F%3F
http://mall.alisoft.com/%CE%92??
http%3A%2F%2Fmall.alisoft.com%2F%CE%92%3F%3F
charset=GBK /%u6211%u7231
/%E6%88%91%E7%88%B1
%2F%E6%88%91%E7%88%B1
http%3A//mall.alisoft.com/%u6211%u7231
http://mall.alisoft.com/%E6%88%91%E7%88%B1
http%3A%2F%2Fmall.alisoft.com%2F%E6%88%91%E7%88%B1
charset=ISO-5899-1 /%CE%D2%B0%AE
/%C3%8E%C3%92%C2%B0%C2%AE
%2F%C3%8E%C3%92%C2%B0%C2%AE
http%3A//mall.alisoft.com/%CE%D2%B0%AE
http://mall.alisoft.com/%C3%8E%C3%92%C2%B0%C2%AE
http%3A%2F%2Fmall.alisoft.com%2F%C3%8E%C3%92%C2%B0%C2%AE

当把文件格式修改为UTF-8/Unicode时,测试结果和上面不一样;同样设置三种不同charset进行测试,结果却是完全相同,和文件格式为ANSI/ASCII、charset=GBK时的结果完全一样!

从上面几项测试结果信息来回答前面提出的几个问题:
对于第1点:显然,ISO Latin并不是指ISO-8859-1编码,但也并不一定是Unicode内码!按照我的分析,只有当文件格式与charset相匹配时,该三个function才能正常工作(当不匹配时执行结果也是乱码);
对 于第2点:MS是无关的,编码结果依赖于文件格式!当使用ANSI/ASCII保存时,因为系统编码为GBK,所以此时文件实际上是以GBK编码保存的, 所以在function执行时会出现第一种测试情况;而当文件以UTF/Unicode保存时,各种charset情况下都能正常执行,估计是js引擎在 底层做了很多事情;

总结起来,要想让这3个function正常工作,最好是用Unicode系列文件格式,这样就和charset无关了;若采用 ANSI/ASCII文件格式,则charset需要设置为与系统默认编码一致,否则function执行会出现意想不到的结果;在此基础上,三个 function执行的结果可以解释为:
Escape:将非ASCII @ * / +转义为%uxxxx格式,其中xxxx为字符的Unicode内码;
其他两个function描述不变,直接转换成UTF-8的%格式,只不过两者的编码字符范围不一样而已。

分享到:
评论

相关推荐

    js中编码函数:escape,encodeURI与encodeURIComponent详解

    escape(), encodeURI()和encodeURIComponent()是在Javascript中用于编码字符串的三个常用的方法,而他们之间的异同却困扰了很多的Javascript初学者,这篇文章详细的给大家介绍了js中编码函数:escape,encodeURI与...

    JS中三种编码方式(escape,encodeURI,encodeURIComponent)

    总结来说,理解并正确使用`escape`、`encodeURI`和`encodeURIComponent`是JavaScript开发中的重要技能,它们有助于确保数据在网络中的安全传输和正确解析。在处理URL、查询参数或其他需要编码的数据时,要根据具体...

    encodeURIComponent encodeURI 中文转GBK编码

    serialize , encodeURIComponent encodeURI 中文转成GBK编码 encodeURIComponent encodeURI 默认转 utf-8 ;重写方法 转成GBK

    escape、encodeURI、encodeURIComponent 区别详解

    ### escape、encodeURI、encodeURIComponent 区别详解 在前端开发中,经常需要用到字符串编码与解码的方法来确保数据在网络传输中的正确性与安全性。本文将详细介绍 `escape()`、`encodeURI()` 和 `...

    Javascript中escape(),_encodeURI()和encodeURIComponent()之精析与比较.doc

    在JavaScript中,`escape()`, `encodeURI()`, 和 `encodeURIComponent()` 是三个常见的字符串编码函数,它们各自有独特的用途和特点。理解它们的区别对于编写健壮的JavaScript代码至关重要。 首先,`escape()` 函数...

    javaScript encodeURI中文乱码

    ### JavaScript encodeURI中文乱码问题解析与解决方案 在Web开发中,处理中文字符或其它非ASCII字符时,经常遇到的问题之一就是编码问题,特别是在URL处理过程中。JavaScript中的`encodeURI()`函数是用于对URL进行...

    谈谈encodeURI和encodeURIComponent以及escape的区别与应用

    在JavaScript中,`encodeURI()`、`encodeURIComponent()`和`escape()`是三个用于字符串编码的函数,它们的主要目的是确保特殊字符在传输过程中不会引起错误。理解它们之间的差异对于编写正确处理URL和数据的...

    escape、encodeURI 和 encodeURIComponent 的区别

    在JavaScript中,`escape()`, `encodeURI()`, 和 `encodeURIComponent()` 是三个常见的字符串编码函数,它们用于处理和转换字符串中的特殊字符。虽然它们都与字符串编码有关,但各自的作用和适用场景有所不同。 ...

    url的三个js编码函数escape(),encodeURI(),encodeURIComponent()简介

    ### URL的三个JS编码函数:`escape()`, `encodeURI()`, `encodeURIComponent()` 简介 在Web开发中,经常遇到的一个问题是URL传递中文字符时出现乱码的情况。为了解决这一问题,JavaScript提供了几种不同的编码方法...

    简单明了区分escape、encodeURI和encodeURIComponent

    本文主要关注三个与URL编码相关的函数:`escape`、`encodeURI`和`encodeURIComponent`。这些函数各有其特定的用途,理解它们的区别至关重要。 首先,我们来看`escape`函数。`escape`并不专门用于URL编码,它实际上...

    javascript 字符 Escape,encodeURI,encodeURIComponent

    本文将详细介绍`escape()`、`encodeURI()`和`encodeURIComponent()`这三个函数,并解释它们的区别和使用场景。 首先,`escape()`方法是JavaScript最早提供的一个编码函数,它基于ISO Latin字符集对字符串进行编码。...

    java中文乱码之解决URL中文乱码问题的方法

    URL中文乱码问题主要是由于URL编码和解码过程中的不一致导致的。下面将详细介绍如何解决这个问题,并探讨几种常用的方法。 首先,我们需要了解URL编码的基本原理。URL(统一资源定位符)不能包含某些特殊字符,如...

    深入分析escape()、encodeURI()、encodeURIComponent()的区别及示例

    JavaScript中有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape, decodeURI, decodeURIComponent 。 下面简单介绍一下它们的区别: 1 escape()函数 定义和...

    JavaScript encodeURI 和encodeURIComponent

    encodeURI和encodeURIComponet函数都是javascript中用来对URI进行编码,将相关参数转换成UTF-8编码格式的数据。URI在进行定位跳转时,参数里面的中文、日文等非ASCII编码都会进行编码转换

Global site tag (gtag.js) - Google Analytics