2.8 字符集知识-让前端告别乱码

网页中为什么会出现乱码

大家有没有看过一部谍战剧叫做《潜伏》的，孙红雷在广播里收听组织公开发送的数字编码，然后按顺序用数字编码去到一本书里查找响应的文字，组成一个情报，试想如果敌方拿着另一本书去索引文字，是不是会得到一段莫名其妙的文字？
简单的说乱码（mojibake）的出现是因为：编码和解码时用了不同或者不兼容的字符集。

什么是字符集

计算机信息（数字、文字、图片）在存储介质中是以二进制 1 和 0（01000101）进行存储的。我们在计算机屏幕上如果看到他们就没有办法解读的，这就需要规则将这些二进制的信息，转化为可读的实体文字。简单的说字符集就规定了某个文字对应的二进制数字存放方式（编码）和某串二进制数值代表了哪个文字（解码）的转换关系。

字符集就是将这些二进制数据进行翻译的规则，使用不同的规则就会产生不同的结果，如果使用错了字符集就会产生乱码，比如服务端响应客户端http请求,发送了一段utf-8格式的文本，客户端却使用gb2312格式查看，就会导致乱码的情况。

字符集是一个规则集合的名字，字符集（charset） = 字库表（character repertoire）、编码字符集（coded character set）、字符编码（character encoding form）。

1. 字库表：类似一本字典，是一个相当于所有可读或者可显示字符的数据库，字库表决定了整个字符集能够展现表示的所有字符的范围。
2. 编码字符集：简称字符集，如Unicode、ASCII，用一个编码值code point来表示一个字符（即该字符在子库表中的位置），这个值称为字符对应于编码字符集（如：Unicode、ASCII）的序号。如在ASCII中A在表中排第65位，而编码后A的数值是0100 0001也即十进制的65的二进制转换结果。
3. 字符编码：是编码字符集和实际存储数值之间的转换关系。字符，是根据字符编码方案转换为一个二进制数值存储在计算机中的。

既然能够通过序号找到字库表中的字符为什么还要多此一举来对编码字符集的数值进行转换，讲转换后的值存储在计算机中呢？原因是因为我们要节省计算机的存储空间。
Unicode是编码字符集，而UTF-8就是字符编码，即Unicode规则字库的一种实现形式。随着互联网的发展，对同一字库集的要求越来越迫切，Unicode标准也就自然而然的出现。它几乎涵盖了各个国家语言可能出现的符号和文字，并将为他们编号。Unicode 也被称为万国码，Unicode是一个很大的集合，现在的规模可以容纳100多万个符号。Unicode的编号从0000开始一直到10FFFF共分为17个平面，每个平面中有65536个字符。而UTF-8则只实现了第一个平面，可见UTF-8虽然是一个当今接受度最广的字符集编码，但是它并没有涵盖整个Unicode的字库。

网页中的字符集

ASCII、ANSI、ISO-8859-1

为了让人能够读懂二进制的数据，最早是美国人制作了一张表，里面规定了英文字母、数字和一些特殊符号的转换规则，ASCII 码使用指定的7 位或8 位二进制数组合来表示这些字符，比如二进制数据01000001使用ASCII字符集转换成A。
ANSI和ISO-8859-1都是ASCII 的扩展。
他们之间的区别对前端不重要，只要知道两件事：1、HTML4中默认的字符编码更改为 ISO-8859-1，2、ANSI、ISO-8859-1和ASCII一样不能显示中文。

gb2312和BIG5

最早的计算机只能显示英文、数字和符号，随着计算机在世界上的普及，各个国际都推出了编码字符集，gb2312是简体中文字符集，big5是繁体中文字符集。但是这些字符集都存在一个问题，如果没有安装简体中文的字库，浏览器访问这些字符集编码的网页时就会显示乱码。

Unicode 和UTF-8

上文已经提到了Unicode字符集，Unicode中有一个很大的字库，Unicode也被称为万国码，是由Unicode学术学会的组织编制的，能让分布于全世界的计算机都能够正确解读其涵盖的字符。

UTF-8

HTML5 中默认的字符编码是 UTF-8。

UTF-8是字符编码，是Unicode规则字库的一种实现形式，即UTF-8的物理存储和Unicode序号的转换关系。 UTF-8编码为变长编码。最小编码单位（code unit）为一个字节。一个字节的前1-3个bit为描述性部分，后面为实际序号部分。

UTF-8编码为变长编码。最小编码单位（code unit）为一个字节。一个字节的前1-3个bit为描述性部分，后面为实际序号部分。

• 如果一个字节的第一位为0，那么代表当前字符为单字节字符，占用一个字节的空间。0之后的所有部分（7个bit）代表在Unicode中的序号。
• 如果一个字节以110开头，那么代表当前字符为双字节字符，占用2个字节的空间。110之后的所有部分（5个bit）加上后一个字节的除10外的部分（6个bit）代表在Unicode中的序号。且第二个字节以10开头
• 如果一个字节以1110开头，那么代表当前字符为三字节字符，占用3个字节的空间。110之后的所有部分（5个bit）加上后两个字节的除10外的部分（12个bit）代表在Unicode中的序号。且第二、第三个字节以10开头
• 如果一个字节以10开头，那么代表当前字节为多字节字符的第二个字节。10之后的所有部分（6个bit）和之前的部分一同组成在Unicode中的序号。

我们分别看三个从一个字节到三个字节的UTF-8编码例子：

实际字符	在Unicode字库序号的十六进制	在Unicode字库序号的二进制	UTF-8编码后的二进制	UTF-8编码后的十六进制
$	0024	010 0100	0010 0100	24
¢	00A2	000 1010 0010	1100 0010 1010 0010	C2 A2
€	20AC	0010 0000 1010 1100	1110 0010 1000 0010 1010 1100	E2 82 AC

1. 3个字节的UTF-8十六进制编码一定是以E开头的
2. 2个字节的UTF-8十六进制编码一定是以C或D开头的
3. 1个字节的UTF-8十六进制编码一定是以比8小的数字开头的