JavaScript字符集编码与解码详谈


Posted in Javascript onFebruary 02, 2017

一、字符集

1)字符与字节(Character)

字符是各种文字和符号的总称,包括乱码;一个字符对应1~n个字节,一字节对应8位,每位用0或1表示。

2)字符集(Character Set)

字符集是多个字符的集合,每个字符集包含的字符个数不同,常见字符集名称:ASCII字符集、GB2312字符集、Unicode字符集等。

3)字符集编码(Character Encoding)

字符集编码就是将符号转换为计算机可读的二进制,解码就是把二进制转换为人类可读的符号。

字符集大多对应一种编码方式(例如GBK对应GBK编码),但Unicode编码有多种,包括UTF-8、UTF-16、UTF-32和UTF-7。

目前网页用的最多的就是“UTF-8”,UTF-8使用一至四个字节为每个字符编码,是ASCII的一个超集,所以现存的ASCII文本不需要转换

二、浏览器进制

1)HTML属性中使用十进制和十六进制

十进制在HTML中可使用“8”,十六进制,则使用“Z”,比十进制多了个x,进制码中也多了a~f这6个字符来表示10~15。

2)CSS属性中使用十进制和十六进制

CSS兼容HTML的进制形式,除此之外,十六进制还可以使用“\6c”的形式来表示。

3)JavaScript编码封装

可以直接通过eval执行字符串八进制和十六进制两种编码方式,其中八进制用“\56”表示,十六进制用“\x5c”表示。

如果代码中应用了汉字并且需要进行进制编码,那么只能进行十六进制Unicode编码,其表示形式为:“\u4ee3\u7801”。

在“Web前端黑客技术揭秘”中经封装了两个方法来做编码和解码,主要用到了下面两个方法,具体代码可查看此处。

核心代码是:“str.charCodeAt(char).toString(进制)”与“String.fromCharCode(parseInt(code,进制))”

charCodeAt() 方法返回0到65535之间的整数,表示给定索引处的UTF-16代码单元

静态String.fromCharCode() 方法返回使用指定的Unicode值序列创建的字符串。

还可以通过一个在线网页进行编码解码“MonyerJS”。

4)HTML自动解码机制

例如在网页中输入16进制的“Hello”,自动就会解码为“hello”。

还有一些比较熟知的空格“ ”也是这种机制。

三、浏览器编码

JavaScript中有三对可以对字符串编码解码的函数,分别是:

escape/unescape、encodeURI/decodeURI、encodeURIComponent/decodeURIComponent。

主要的区别还是不编码的字符个数。

1)escape不编码的字符有69个

*、+、-、.、/、@、_、0~9、a~z、A~Z而且escape对0~255以外的unicode值进行编码时输出%u****格式。

2)encodeURI不编码的字符有82个

!、#、$、&、'、(、)、*、+、,、-、.、/、:、;、=、?、@、_、~、0~9、a~z、A~Z

3)encodeURIComponent不编码的字符有71个

!、'、(、)、*、-、.、_、~、0~9、a~z、A~Z

Javascript 相关文章推荐
JavaScript类库D
Oct 24 Javascript
图片在浏览器中底部对齐 解决方法之一
Nov 30 Javascript
解决3.01版的jquery.form.js中文乱码问题的解决方法
Mar 08 Javascript
js中生成map对象的方法
Jan 09 Javascript
Jquery EasyUI中弹出确认对话框以及加载效果示例代码
Feb 13 Javascript
jQuery实现标题有打字效果的焦点图代码
Nov 16 Javascript
响应式表格之固定表头的简单实现
Aug 26 Javascript
浅谈Vuejs Prop基本用法
Aug 17 Javascript
React如何利用相对于根目录进行引用组件详解
Oct 09 Javascript
JS中Map和ForEach的区别
Feb 05 Javascript
区别JavaScript函数声明与变量声明
Sep 12 Javascript
JS的深浅复制详细
Oct 16 Javascript
JS实现购物车特效
Feb 02 #Javascript
jQuery实现复选框的全选和反选
Feb 02 #Javascript
jQuery制作图片旋转效果
Feb 02 #Javascript
浅谈javascript中的 “ && ” 和 “ || ”
Feb 02 #Javascript
Javascript中的 “&” 和 “|” 详解
Feb 02 #Javascript
javascript实现简易计算器
Feb 01 #Javascript
javascript实现右下角广告框效果
Feb 01 #Javascript
You might like
php $_SERVER windows系统与linux系统下的区别说明
2014/02/14 PHP
php的4种常见运行方式
2015/03/20 PHP
PHP实现即时输出、实时输出内容方法
2015/05/27 PHP
php实现将Session写入数据库
2015/07/26 PHP
理解php依赖注入和控制反转
2016/05/11 PHP
Yii2 批量插入、更新数据实例
2017/03/15 PHP
Yii2配置Nginx伪静态的方法
2017/05/05 PHP
js实现页面打印功能实例代码(附去页眉页脚功能代码)
2009/12/15 Javascript
用JavaScript修改CSS属性的代码
2013/05/06 Javascript
js中switch case循环实例代码
2013/12/30 Javascript
jquery选择器使用详解
2014/04/08 Javascript
js自定义鼠标右键的实现原理及源码
2014/06/23 Javascript
js操作IE浏览器弹出浏览文件夹可以返回目录路径
2014/07/14 Javascript
jQuery晃动层特效实现方法
2015/03/09 Javascript
JavaScript+html5 canvas实现图片破碎重组动画特效
2016/02/22 Javascript
JS Ajax请求如何防止重复提交
2016/06/13 Javascript
灵活使用数组制作图片切换js实现
2016/07/28 Javascript
用node-webkit把web应用打包成桌面应用(windows环境)
2018/02/01 Javascript
webpack中的热刷新与热加载的区别
2018/04/09 Javascript
vue图片上传本地预览组件使用详解
2019/02/20 Javascript
Vue-CLI项目中路由传参的方式详解
2019/09/01 Javascript
详解在Vue.js编写更好的v-for循环的6种技巧
2020/04/14 Javascript
一篇超完整的Vue新手入门指导教程
2020/11/18 Vue.js
[48:44]2014 DOTA2国际邀请赛中国区预选赛5.21 TongFu VS HGT
2014/05/22 DOTA
python实现发送邮件功能代码
2017/12/14 Python
windows下pycharm安装、创建文件、配置默认模板
2018/07/31 Python
详解Python3注释知识点
2019/02/19 Python
通过python实现弹窗广告拦截过程详解
2019/07/10 Python
在pycharm创建scrapy项目的实现步骤
2020/12/01 Python
Python3+Flask安装使用教程详解
2021/02/16 Python
美国在线咖啡、茶和餐厅供应商:LollicupStore
2018/05/04 全球购物
人力资源行政经理自我评价
2013/10/23 职场文书
新生入学欢迎词
2015/01/26 职场文书
2019年幼儿园家长接送责任书
2019/10/29 职场文书
python实现ROA算子边缘检测算法
2021/04/05 Python
正确使用MySQL update语句
2021/05/26 MySQL