如何通过JS实现转码与解码


Posted in Javascript onFebruary 21, 2020

这篇文章主要介绍了如何通过JS实现转码与解码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

escape 和 unescape

escape()不能直接用于URL编码,它的真正作用是返回一个字符的Unicode编码值。

采用unicode字符集对指定的字符串除0-255以外进行编码。所有的空格符、标点符号、特殊字符以及更多有联系非ASCII字符都将被转化成%xx格式的字符编码(xx等于该字符在字符集表里面的编码的16进制数字)。比如,空格符对应的编码是%20。

escape不编码字符有69个:*,+,-,.,/,@,_,0-9,a-z,A-Z。

escape()函数用于js对字符串进行编码。

encodeURI 和 decodeURI

把URI字符串采用UTF-8编码格式转化成escape各式的字符串。

encodeURI不编码字符有82个:!,#,$,&,',(,),*,+,,,-,.,/,:,;,=,?,@,_,~,0-9,a-z,A-Z

encodeURI()用于整个url编码

encodeURIComponent 和 decodeURIComponent

与encodeURI()的区别是,它用于对URL的组成部分进行个别编码,而不用于对整个URL进行编码。

因此,"; / ? : @ & = + $ , #",这些在encodeURI()中不被编码的符号,在encodeURIComponent()中统统会被编码。至于具体的编码方法,两者是一样。把URI字符串采用UTF-8编码格式转化成escape格式的字符串。

encodeURIComponent() 用于参数的传递,参数包含特殊字符可能会造成间断。

总结

escape编码字符串

简单来说,escape是对字符串(string)进行编码(而另外两种是对URL),作用是让它们在所有电脑上可读。

编码之后的效果是%XX或者%uXXXX这种形式。

其中 ASCII字母 数字 @*/+ 等字符不会被编码,其余的都会。

最关键的是,当需要对URL编码时,忘记这个方法,这个方法是针对字符串使用的,不适用于URL。

URL编码encodeURI和encodeURIComponent

对URL编码是常见的事,所以这两个方法应该是实际中要特别注意的。它们都是编码URL,唯一区别就是编码的字符范围,其中

encodeURI方法不会对下列字符编码 ASCII字母 数字 ~!@#$&*()=:/,;?+'

encodeURIComponent方法不会对下列字符编码 ASCII字母 数字 ~!*()'

所以encodeURIComponent比encodeURI编码的范围更大。

实际例子来说,encodeURIComponent会把 http:// 编码成 http%3A%2F%2F 而encodeURI却不会。

如果只是编码字符串,不和URL有半毛钱关系,那么用escape。

如果你需要编码整个URL,然后需要使用这个URL,那么用encodeURI。
比如

encodeURI(http://www.cnblogs.com/some other thing);

编码结果:

http://www.cnblogs.com/some%20other%20thing

其中,空格被编码成了%20。但是如果用了encodeURIComponent,那么结果变为

http%3A%2F%2Fwww.cnblogs.com%2Fseason-huang%2Fsome%20other%20thing

连 "/" 都被编码了,整个URL已经没法用了。

当需要编码URL中的参数的时候,那么encodeURIComponent是最好方法

var param = "http://www.cnblogs.com/"; //param为参数
param = encodeURIComponent(param);
var url = "http://www.cnblogs.com?next=" + param;
console.log(url) //http://www.cnblogs.com?next=http%3A%2F%2Fwww.cnblogs.com%2F

参数中的 "/" 可以编码,如果用encodeURI肯定要出问题,因为后面的/是需要编码的。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
prototype Element学习笔记(篇一)
Oct 26 Javascript
js下获取div中的数据的原理分析
Apr 07 Javascript
js关于精确计算和数值格式化以及直接引js文件
Jan 28 Javascript
jquery退出each循环的写法
Feb 26 Javascript
JS实现消息来时让网页标题闪动效果的方法
Apr 20 Javascript
jQuery实现的模拟弹出窗口功能示例
Nov 24 Javascript
jquery实现轮播图效果
Feb 13 Javascript
react实现菜单权限控制的方法
Dec 11 Javascript
vue中使用refs定位dom出现undefined的解决方法
Dec 21 Javascript
vue项目常用组件和框架结构介绍
Dec 24 Javascript
基于vue.js 2.x的虚拟滚动条的示例代码
Jan 23 Javascript
Bootstrap告警框(alert)实现弹出效果和短暂显示后上浮消失的示例代码
Aug 27 Javascript
TensorFlow.js 微信小程序插件开始支持模型缓存的方法
Feb 21 #Javascript
微信小程序使用 vant Dialog组件的正确方式
Feb 21 #Javascript
JS实现判断移动端PC端功能
Feb 21 #Javascript
JS获取表格视图所选行号的ids过程解析
Feb 21 #Javascript
微信小程序vant弹窗组件的实现方式
Feb 21 #Javascript
纯js实现无缝滚动功能代码实例
Feb 21 #Javascript
vue中实现动态生成二维码的方法
Feb 21 #Javascript
You might like
PHP语法速查表
2007/01/02 PHP
PHP中删除变量时unset()和null的区别分析
2011/01/27 PHP
学习php分页代码实例
2013/10/24 PHP
PHP中Session和Cookie是如何操作的
2015/10/10 PHP
php限制文件下载速度的代码
2015/10/20 PHP
PHP按一定比例压缩图片的方法
2018/10/12 PHP
在laravel框架中使用model层的方法
2019/10/08 PHP
jquery 如何动态添加、删除class样式方法介绍
2012/11/07 Javascript
jQuery中:has选择器用法实例
2014/12/30 Javascript
浅谈javascript中字符串String与数组Array
2014/12/31 Javascript
jquery输入数字随机抽奖特效的简单实现代码
2016/06/10 Javascript
JS实现京东首页之页面顶部、Logo和搜索框功能
2017/01/12 Javascript
AngularJS constant和value区别详解
2017/02/28 Javascript
jQuery+ThinkPHP+Ajax实现即时消息提醒功能实例代码
2017/03/21 jQuery
微信小程序图片宽100%显示并且不变形
2017/06/21 Javascript
vue项目实战总结篇
2018/02/11 Javascript
vue.js基于v-for实现批量渲染 Json数组对象列表数据示例
2019/08/03 Javascript
JavaScript代码简化技巧实例解析
2020/09/09 Javascript
[01:29]2017 DOTA2国际邀请赛官方英雄手办展示
2017/03/18 DOTA
[32:17]完美世界DOTA2联赛循环赛LBZS vs Forest第二场 10月30日
2020/10/31 DOTA
python中安装模块包版本冲突问题的解决
2017/05/02 Python
mac下给python3安装requests库和scrapy库的实例
2018/06/13 Python
Python不支持 i ++ 语法的原因解析
2020/07/22 Python
python3 中使用urllib问题以及urllib详解
2020/08/03 Python
任意一块网页内容实现“活”的背景(目前火狐浏览器专有)
2014/05/07 HTML / CSS
Vans(范斯)德国官网:美国南加州的原创极限运动潮牌
2017/05/02 全球购物
爱尔兰领先的在线体育用品零售商:theGAAstore
2018/04/16 全球购物
JYSK加拿大:购买家具、床垫、家居装饰等
2020/02/14 全球购物
CK加拿大官网:Calvin Klein加拿大
2020/03/14 全球购物
全球性的众包图形设计市场:DesignCrowd
2021/02/02 全球购物
创建索引时需要注意的事项
2013/05/13 面试题
什么是反射
2012/03/17 面试题
中学生运动会入场词
2014/02/12 职场文书
公安局副政委班子个人对照检查材料
2014/10/04 职场文书
违纪检讨书
2015/01/27 职场文书
思想工作总结范文
2015/08/12 职场文书