如何通过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 相关文章推荐
javascript显示选择目录对话框的代码
Nov 10 Javascript
jquery实现心算练习代码
Dec 06 Javascript
caller和callee的区别介绍及演示结果
Mar 10 Javascript
解决js函数闭包内存泄露问题的办法
Jan 25 Javascript
浅析Bootstrap缩略图组件与警示框组件
Apr 29 Javascript
jQuery简单注册和禁用全局事件的方法
Jul 25 Javascript
原生js封装的一些jquery方法(详解)
Sep 20 Javascript
完美解决IE9浏览器出现的对象未定义问题
Sep 29 Javascript
VUE+elementui面包屑实现动态路由详解
Nov 04 Javascript
纯js+css实现仿移动端淘宝网站的弹出详情框功能
Dec 29 Javascript
Vue中通过vue-router实现命名视图的问题
Apr 23 Javascript
微信小程序收藏功能的实现代码
Jun 19 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获取用户浏览器版本的方法
2015/01/03 PHP
php微信高级接口群发 多客服
2016/06/23 PHP
微信支付开发发货通知实例
2016/07/12 PHP
PDO::_construct讲解
2019/01/27 PHP
PHP7数组的底层实现示例
2019/08/25 PHP
php 使用 __call实现重载功能示例
2019/11/18 PHP
javascript取消文本选定的实现代码
2010/11/14 Javascript
jQuery中阻止冒泡事件的方法介绍
2014/04/12 Javascript
JSON相关知识汇总
2015/07/03 Javascript
详解javascript函数的参数
2015/11/10 Javascript
jquery中ajax跨域方法实例分析
2015/12/18 Javascript
Bootstrap安装环境配置教程分享
2016/05/27 Javascript
实例讲解JavaScript中的this指向错误解决方法
2016/06/13 Javascript
原生js实现tab选项卡切换
2020/03/23 Javascript
PHP捕捉异常中断的方法
2016/10/24 Javascript
基于JavaScript实现窗口拖动效果
2017/01/18 Javascript
关于Vue组件库开发详析
2018/07/01 Javascript
jQuery+vue.js实现的多选下拉列表功能示例
2019/01/15 jQuery
使用post方法实现json往返传输数据的方法
2019/03/30 Javascript
vue2.0+SVG实现音乐播放圆形进度条组件
2019/09/21 Javascript
[49:56]VG vs Optic 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
Python使用ftplib实现简易FTP客户端的方法
2015/06/03 Python
一波神奇的Python语句、函数与方法的使用技巧总结
2015/12/08 Python
Python的Flask框架及Nginx实现静态文件访问限制功能
2016/06/27 Python
Python网页正文转换语音文件的操作方法
2018/12/09 Python
linux中如何使用python3获取ip地址
2019/07/15 Python
python基于property()函数定义属性
2020/01/22 Python
介绍一下如何优化MySql
2016/12/20 面试题
艺术爱好者的自我评价分享
2013/10/08 职场文书
党员自我评价分享
2013/12/13 职场文书
中专生求职自荐信范文
2013/12/22 职场文书
文化活动实施方案
2014/03/28 职场文书
环保专项行动方案
2014/05/12 职场文书
深入浅析React中diff算法
2021/05/19 Javascript
如何在CSS中绘制曲线图形及展示动画
2021/05/24 HTML / CSS
分享提高 Python 代码的可读性的技巧
2022/03/03 Python