比较escape、encodeURI、encodeURIComponent
估计很多前端工程师并不清楚escape,encodeURI, encodeURIComponent的区别,也不知道什么时候该用哪个方法,以及这些方法为什么要被用到,下面我主要来阐述一下这三个方法的区别以及用法。
escape 方法:
The escape method returns a string value (in Unicode format) that contains the contents of [the argument]. All spaces, punctuation, accented characters, and any other non-ASCII characters are replaced with %xx encoding, where xx is equivalent to the hexadecimal number representing the character. For example, a space is returned as "%20."
escape 方法返回一个包含参数内容的UNICODE格式的字符串值。所有的“空格”、“标点”、“重音字符”以及任何非ASCII字符都会被替换为带着%xx 编码,这里的xx是一个表示原来字符的16进制数字。例如一个空格会被替换为%20
The escape and unescape functions let you encode and decode strings. The escape function returns the hexadecimal encoding of an argument in the ISO Latin character set. The unescape function returns the ASCII string for the specified hexadecimal encoding value.
escape 和 unescape 方法让你可以对字符串编码和解码。 escape 调用方法将返回对ISO拉丁字符参数的16进制编码,而 unescape 方法会为指定的16进制编码返回ASCII 字符。
看看例子吧
- escape('~!@#$%^&*(){}[]=:/,;?+\'"\\')
- //%7E%21@%23%24%25%5E%26*%28%29%7B%7D%5B%5D%3D%3A/%2C%3B%3F+%27%22%5C
encode 方法:
The encodeURI method returns an encoded URI. If you pass the result to decodeURI, the original string is returned. The encodeURI method does not encode the following characters: ":", "/", ";", and "?". Use encodeURIComponent to encode these characters.
encodeURI 方法返回一个编码的 URI, encodeURI 不对以下字符编码:
":", "/", ";", and "?" 而可以用encodeURIComponent对这些字符编码
下面说的更详细一些
Encodes a Uniform Resource Identifier (URI) by replacing each instance of certain characters by one, two, or three escape sequences representing the UTF-8 encoding of the character.
通过替换每一个字符实例成一个或是两三个编码过的UTF-8字符,来对URI编码。
例子:
- encodeURI('~!@#$%^&*(){}[]=:/,;?+\'"\\')
- //~!@#$%25%5E&*()%7B%7D%5B%5D=:/,;?+'%22%5C
encodeURIComponent 方法:
The encodeURIComponent method returns an encoded URI. If you pass the result to decodeURIComponent, the original string is returned. Because the encodeURIComponent method encodes all characters, be careful if the string represents a path such as /folder1/folder2/default.html. The slash characters will be encoded and will not be valid if sent as a request to a web server. Use the encodeURI method if the string contains more than a single URI component.
encodeURIComponent会对更多的字符进行编码,包括表示路径的"/",所以当使用时,需要谨慎
Encodes a Uniform Resource Identifier (URI) component by replacing each instance of certain characters by one, two, or three escape sequences representing the UTF-8 encoding of the character.
这个解释和encode一样,实际上encodeURI 和 encodeURIComponent 差别就是一个是对更多的字符编码,而一个只是对URI部分编码。
同样字符串的例子:
- escape('~!@#$%^&*(){}[]=:/,;?+\'"\\')
- //%7E%21@%23%24%25%5E%26*%28%29%7B%7D%5B%5D%3D%3A/%2C%3B%3F+%27%22%5C
- encodeURI('~!@#$%^&*(){}[]=:/,;?+\'"\\');
- //~!@#$%25%5E&*()%7B%7D%5B%5D=:/,;?+'%22%5C
- encodeURIComponent('~!@#$%^&*(){}[]=:/,;?+\'"\\');
- //~!%40%23%24%25%5E%26*()%7B%7D%5B%5D%3D%3A%2F%2C%3B%3F%2B'%22%5C
总结:
该怎么使用呢?
escape:
escape 不会编码的字符:@*/+
escape方法不回编码+字符,+字符在服务器端会被解释成空格,这点和通过表达提交一样。
由于escape有这样的缺点,和它不能很好的正确处理非ASCII字符的事实,我们应该尽量避免(对URI)使用escape,最好的方式是encodeURIComponent。
encodeURI:
encodeURI 不会编码的字符很多,有:~!@#$&*()=:/,;?+'
在对一段URI编码来说,encodeURI方法比escape方法更专业一些。当你需要编码一整个URI的时候,你可以使用此方法,因为URI中的合法字符都不会被编码转换。需要注意到是字符’也是URI中的合法字符,所以也不会被编码转换。
encodeURIComponent:
encodeURIComponent不会编码的字符: ~!*()'
encodeURIComponent方法在编码单个URIComponent(指请求参数)应当是最常用的。需要注意到是字符’也是URI中的合法字符,所以也不会被编码转换。
我的小结:
其实前端最常用的是encodeURIComponent,因为这个方法会把URI中的queryString中的非法字符编码,这样通过get请求向服务器端传递参数的时候不会出错。
escape 在后端和前端的接口规约里常常会碰到,但是一般不需要前端在本地escape,一般是后端接口吐出 escape后的数据,前端unescape。
此文章是翻译而来
原文:http://xkr.us/articles/javascript/encode-compare/
关于URL,URI不太明白的同学可以看看 http://www.ibm.com/developerworks/cn/xml/x-urlni.html
这篇文章
比较escape、encodeURI、encodeURIComponent的更多相关文章
- url的三个js编码函数escape(),encodeURI(),encodeURIComponent()简介
url的三个js编码函数escape(),encodeURI(),encodeURIComponent()简介 2014年10月12日 16806次浏览 引子 浏览器URl地址,上网一定会用到,但是浏 ...
- escape,encodeURI,encodeURIComponent函数比较
escape,encodeURI,encodeURIComponent函数比较 js对文字进行编码涉及3个函数:escape,encodeURI,encodeURIComponent,相应3个解码函数 ...
- escape,encodeURI,encodeURIComponent
JavaScript/js中,有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,d ...
- Flex中escape/encodeURI/encodeURIComponent的区别
Flex中提供了三种转码函数,各有各的区别, escape,encodeURI,encodeURIComponent 这三个函数不仅在flex中有道运用在javascript中同样的含义 ,今天我仔细 ...
- url的三个js编码函数escape(),encodeURI(),encodeURIComponent()简介【转】
引子 浏览器URl地址,上网一定会用到,但是浏览器地址有中文或者浏览器url参数操作的时候,经常会用到encodeURIComponent()和decodeURIComponent()以及encode ...
- JavaScript中有三个可以对字符串编码的函数,分别是: escape(),encodeURI(),encodeURIComponent()
JavaScript中有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decod ...
- JavaScript中有对字符串编码的三个函数:escape,encodeURI,encodeURIComponent
JavaScript中有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decod ...
- escape,encodeURI,encodeURIComponent的区别
escape是对字符串进行编码而另外两种是对URL. encodeURI方法不会对下列字符编码 ASCII字母 数字 ~!@#$&*()=:/,;?+'encodeURIComponent方法 ...
- js中的三个编码函数:escape,encodeURI,encodeURIComponent
1. eacape(): 该方法不会对 ASCII 字母和数字进行编码,也不会对下面这些 ASCII 标点符号进行编码: * @ - _ + . / .其他所有的字符都会被转义序列替换.其它情况下es ...
- 浏览器编码的函数简介escape(),encodeURI(),encodeURIComponent()
1.escape() escape()是js编码函数中最古老的一个.虽然这个函数现在已经不提倡使用了,但是由于历史原因,很多地方还在使用它,所以有必要先从它讲起. 实际上,escape()不能直接用于 ...
随机推荐
- javascript 面向对象制作坦克大战 (一)
PS:这个坦克大战是在网上下的一段源码之后,自己进行的重写. 写这个的目的是为了巩固自己这段时间对js的学习.整理到博客上,算是对自己近端时间学习js的一个整理. 同时也希望可以帮助到学习js的园 ...
- [原创]谷歌插件 - YE搜图助手(YeImageFinder)
最新版本:下载 版本:v1.5 更新时间:2014年10月08日 +完善了:YeImageFinder:支持在每次启用插件时,也能正常绑定右键! +完善了:每次做完动作后,就马上关闭自身! 版本:v ...
- (转)我是如何在SQLServer中处理每天四亿三千万记录的
首先声明,我只是个程序员,不是专业的DBA,以下这篇文章是从一个问题的解决过程去写的,而不是一开始就给大家一个正确的结果,如果文中有不对的地方,请各位数据库大牛给予指正,以便我能够更好的处理此次业务. ...
- android studio 中获取sha1
使用keytool 一.配置环境变量 由于要用到keytool工具,而keytool是jdk里的一个工具,首先将jdk/bin所在的目录加到环境变量的PATH中 看我的keytool所在位置 将所在路 ...
- bzoj 1778 [Usaco2010 Hol]Dotp 驱逐猪猡(高斯消元)
[题意] 炸弹从1开始运动,每次有P/Q的概率爆炸,否则等概率沿边移动,问在每个城市爆炸的概率. [思路] 设M表示移动一次后i->j的概率.Mk为移动k次后的概率,则有: Mk=M^k 设S= ...
- Tkinter教程之Button篇(1)
本文转载自:http://blog.csdn.net/jcodeer/article/details/1811298 #Tkinter教程之Button篇(1)#Button功能触发事件'''1.一个 ...
- Python学习笔记——正则表达式
今天把之前学的正则表达式好好总结总结. 一.元字符 . : .表示可以匹配任意一个字符 \d : \d表示可以匹配任意一个数字 \D : \D表示可以匹配任意一个非数字 \s : \s表示 ...
- Install_pygments
安装Pygments语法高亮 On OS X Leopard, Snow Leopard 1 $ sudo easy_install Pygments Alternatively on OS X wi ...
- 转:高性能Mysql主从架构的复制原理及配置详解
温习<高性能MySQL>的复制篇. 1 复制概述 Mysql内建的复制功能是构建大型,高性能应用程序的基础.将Mysql的数据分布到多个系统上去,这种分布的机制,是通过将Mysql的某一台 ...
- 第二百三十九天 how can I 坚持
去看了个电影,消失的凶手,乐视会员送的电影票,有点虐心,不过看着感觉还挺不错. 下了班就去看了,也没有吃饭,不过没感觉到饿,回来吃了份泡面,还喝了袋冰凉的酸奶,现在已经感觉肚子有点疼了,哎.. 哲学是 ...