【ECMAScript】一种基于utfx库的JSON和二进制相互转换方法

1. 前言

        刚入门网页开发的同学，特别的非计算机类专业出身，对二进制数据知之甚少，但是计算机中所有数据都是由0和1表示的（数字电路中是指高低电平），我们看的视频、图片、电子书籍、听得音乐等等，都是用很多很多个0和1表示的。而多少个0和1表示什么，则是从事计算机设计人员/软件开发人员/计算机科学家指定的。

        本文讲到将JSON数据转换成二进制数据，并还原回来。对于入门级同学，可以当做一次理解二进制数据的机会；而对于有一定开发年限的同学，在经常使用JSON或xml来与后端交换数据，是否可以尝试直接以二进制形式和后端交换数据。

        在开始正文之前，先了解本文涉及的一些知识点。如下表所示：

知识点	描述
Binary	二进制数据由0和1组成，1 bit是0或1，1 byte由8 bits组成（0000 0000 ~ 1111 1111），1kb有1024 bytes，1MB有1024KB，1GB有1024MB，1GB合计1024 * 1024 * 1024 * 8 = 8,589,934,592 bits，约85亿个二进制位。 有符号整型、无符号整型、浮点型在二进制中是怎么表示的，以及原码、反码、补码转换，后续文章会进行讲解
ArrayBuffer	ArrayBuffer对象用来表示通用的、固定长度的原始二进制数据缓冲区，它是一个字节数组，为了理解字节数组，我们举个例子。 普通数组表示：[1, 2, 13, 15, 20, 37]，为了方便理解，类比过来，字节数组会是 [0000 0001, 0000 0010, 0000 1101, 0000 1111, 0001 0100, 0010 0101]（16进制表示[01, 02, 0C, 0F, 14, 25]，长度为6个字节的字节数组），当然实际在内存可能排列在一起的000000010000001000001101000011110001010000100101。 这个二进制数据缓冲区，并不能直接操作，需要使用TypedArray对象或DataView对象来操作。
DataView	DataView视图是一个可以从ArrayBuffer对象中读写多种数值类型的底层接口。包含： getInt8/setInt8、getUint8/setUint8、getInt16/setInt16、getUint16/setUint16、getInt32/setInt32、getUint32/setUint32、getBigInt64/seBigtInt64、getBigUint64/setBigUint64、getFloat32/setFloat32、getFloat64/setFloat64。 同样一段二进制数据，以不同接口或字节序操作，得到不同表示结果。
Unicode	Unicode是一个符号集，即规定每个符号的二进制值表示，但是没有规定如何存储。Unicode字符集的编码范围是0x0000~0x10FFFF，需要1到3个字节来表示。 Unicode仅是对字符进行编号，无法区分3个字节是表示1个字符还是3个字符，因此出现了多种存储方式，常见的有 UTF-8、UTF-16、UTF-32，它们分别采用不同的二进制格式来表示Unicode字符。
UTF-8	UTF-8（Unicode Transformation Format-8）是一种变长字符编码，被定义为将码点编码为1到4个字节，具体取决于码点数值中有效二进制位的数量。 0000 0000 - 0000 007F ↔ 0xxxxxxx 0000 0080 - 0000 07FF ↔ 110xxxxx 10xxxxxx 0000 0800 - 0000 FFFF ↔ 1110xxxx 10xxxxxx 10xxxxxx 0001 0000 - 0010 FFFF ↔ 11110xxx 10xxxxxx 10xxxxxx 10xxxxxx
UTF-16	UTF-16编码稍微复杂 高位代理1101 10xx xxxx xxxx（1101 1000 0000 0000 - 1101 1011 1111 1111，0xD800 - 0xDBFF） 低位代理1101 11xx xxxx xxxx（1101 1100 0000 0000 - 1