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 - 如何引入js代码
Mar 09 Javascript
关于文本限制字数的js代码
Apr 02 Javascript
使用变量动态设置js的属性名
Oct 19 Javascript
使用Plupload实现直接上传附件至七牛云存储
Dec 26 Javascript
js中 计算两个日期间的工作日的简单实例
Aug 08 Javascript
Node.js connect ECONNREFUSED错误解决办法
Sep 15 Javascript
React服务端渲染(总结)
Jul 01 Javascript
angular中ui calendar的一些使用心得(推荐)
Nov 03 Javascript
JavaScript实现的简单Tab点击切换功能示例
Jul 06 Javascript
JavaScript进制转换实现方法解析
Jan 18 Javascript
vue-cli3配置favicon.ico和title的流程
Oct 27 Javascript
Node.js path模块,获取文件后缀名操作
Nov 07 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 sprintf()函数让你的sql操作更安全
2008/07/23 PHP
PHP的可变变量名的使用方法分享
2012/02/05 PHP
ThinkPHP实现将本地文件打包成zip下载
2014/06/26 PHP
PHP使用mysql与mysqli连接Mysql数据库用法示例
2016/07/07 PHP
PHP接入支付宝接口失效流程详解
2020/11/10 PHP
JS宝典学习笔记(下)
2007/01/10 Javascript
jquery tools之tabs 选项卡/页签
2009/07/25 Javascript
PHP实现的各种中文编码转换类分享
2015/01/23 Javascript
jQuery实现日期联动效果实例
2016/07/26 Javascript
JavaScript求一组数的最小公倍数和最大公约数常用算法详解【面向对象,回归迭代和循环】
2018/05/07 Javascript
vue中使用vue-cli接入融云实现即时通信
2019/04/19 Javascript
如何对react hooks进行单元测试的方法
2019/08/14 Javascript
layui switch 开关监听 弹出确定状态转换的例子
2019/09/21 Javascript
在Koa.js中实现文件上传的接口功能
2019/10/08 Javascript
JS实现的进制转换,浮点数相加,数字判断操作示例
2019/11/09 Javascript
如何实现iframe父子传参通信
2020/02/05 Javascript
Vue中el-form标签中的自定义el-select下拉框标签功能
2020/04/20 Javascript
[45:18]2018DOTA2亚洲邀请赛 4.3 突围赛 Optic vs iG 第一场
2018/04/04 DOTA
python编程-将Python程序转化为可执行程序[整理]
2007/04/09 Python
Python数据结构与算法之字典树实现方法示例
2017/12/13 Python
python如何派生内置不可变类型并修改实例化行为
2018/03/21 Python
python创建文件备份的脚本
2018/09/11 Python
python实现flappy bird小游戏
2018/12/24 Python
python-tkinter之按钮的使用,开关方法
2019/06/11 Python
Python matplotlib以日期为x轴作图代码实例
2019/11/22 Python
学python爬虫能做什么
2020/07/29 Python
Pycharm 2020.1 版配置优化的详细教程
2020/08/07 Python
python之openpyxl模块的安装和基本用法(excel管理)
2021/02/03 Python
CSS3基础(RGBa、text-shadow、box-shadow、border-radius)
2012/11/13 HTML / CSS
HTML5 Canvas玩转酷炫大波浪进度图效果实例(附demo)
2016/12/14 HTML / CSS
Wedgwood美国官网:英国骨瓷,精美礼品及家居装饰
2018/02/17 全球购物
沃达丰英国有限公司:Vodafone英国
2019/04/16 全球购物
3D空间设计学生找工作的自我评价
2013/10/28 职场文书
群众路线个人剖析材料及整改措施
2014/11/04 职场文书
Matlab如何实现矩阵复制扩充
2021/06/02 Python
CSS实现章节添加自增序号的方法
2021/06/23 HTML / CSS