如何通过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 相关文章推荐
jquery创建一个新的节点对象(自定义结构/内容)的好方法
Jan 21 Javascript
JS判断表单输入是否为空(示例代码)
Dec 23 Javascript
js判断子窗体是否关闭的方法
Aug 11 Javascript
JS模拟Dialog弹出浮动框效果代码
Oct 16 Javascript
使用堆实现Top K算法(JS实现)
Dec 25 Javascript
angularjs表格分页功能详解
Jan 21 Javascript
js 获取经纬度的实现方法
Jun 20 Javascript
JS实现iframe自适应高度的方法(兼容IE与FireFox)
Jun 24 Javascript
微信小程序进行微信支付的步骤昂述
Dec 01 Javascript
Bootstrap实现基于carousel.js框架的轮播图效果
May 02 Javascript
解决vue2.x中数据渲染以及vuex缓存的问题
Jul 13 Javascript
JavaScript实现栈结构详细过程
Dec 06 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制作静态网站的模板框架
2006/10/09 PHP
php解决抢购秒杀抽奖等大流量并发入库导致的库存负数的问题
2014/06/19 PHP
PHP扩展迁移为PHP7扩展兼容性问题记录
2016/02/15 PHP
php打乱数组二维数组多维数组的简单实例
2016/06/17 PHP
php与c 实现按行读取文件实例代码
2017/01/03 PHP
php中关于换行的实例写法
2019/09/26 PHP
锋利的jQuery jQuery中的DOM操作
2010/03/21 Javascript
javascript中的startWith和endWith的几种实现方法
2013/05/07 Javascript
深入理解javascript中defer的作用
2013/12/11 Javascript
javascript通过className来获取元素的简单示例代码
2014/01/10 Javascript
jquery图片轮播特效代码分享
2020/04/20 Javascript
leaflet的开发入门教程
2016/11/17 Javascript
Angular项目中$scope.$apply()方法的使用详解
2017/07/26 Javascript
使用jQuery实现简单的tab框实例
2017/08/22 jQuery
Vue 全局loading组件实例详解
2018/05/29 Javascript
微信小程序 wx:for 与 wx:for-items 与 wx:key的正确用法
2020/05/19 Javascript
解决vue中axios设置超时(超过5分钟)没反应的问题
2020/09/04 Javascript
介绍Python中的fabs()方法的使用
2015/05/14 Python
python实现红包裂变算法
2016/02/16 Python
Python爬取京东的商品分类与链接
2016/08/26 Python
Python使用Scrapy爬虫框架全站爬取图片并保存本地的实现代码
2018/03/04 Python
tensorflow实现简单的卷积神经网络
2018/05/24 Python
对python 数据处理中的LabelEncoder 和 OneHotEncoder详解
2018/07/11 Python
浅谈django三种缓存模式的使用及注意点
2018/09/30 Python
python爬取内容存入Excel实例
2019/02/20 Python
python3.6、opencv安装环境搭建过程(图文教程)
2019/11/05 Python
python中pyqtgraph知识点总结
2021/01/26 Python
华为旗下电子商务平台:华为商城
2016/08/06 全球购物
BrandAlley英国:法国折扣奢侈品网上零售商
2017/07/03 全球购物
ALDO美国官网:加拿大女鞋品牌
2018/12/28 全球购物
线程同步的方法
2016/11/23 面试题
2014年工人工作总结
2014/11/25 职场文书
安全保证书格式
2015/02/28 职场文书
2019个人工作自我评价范文(3篇)
2019/09/19 职场文书
python 进阶学习之python装饰器小结
2021/09/04 Python
uniapp引入支付宝原生扫码插件步骤详解
2022/07/23 Javascript