|
转载请注明文章出处:https://itlanyan.com/string-unicode-utf8-converter/
: u( E1 u( {+ h" z想知道某个字符串的UTF8编码,图方便打算使用在线工具。坑爹的是,号称“UTF8汉字互转”的网页几乎全是字符串和unicode码点互转,并不提供与UTF8编码互转功能。没搞懂unicode码点(code point)和UTF8编码的关系,还大言不惭的说UTF8编码,真让人无语。
- V% b9 R" J) G: F$ [+ U" [5 L
: w; O" }3 _2 h) B& _0 }3 W& b0 }% @, j6 H( g: k* G3 y( r
* b% K% r7 F5 I# M6 E- Q8 _, x
- M* i" f+ ~- D- A/ w9 W" j4 V
/ I. z/ D0 _7 O2 L" l
字符、字节和字节序,unicode和UTF8编码,是理解字符编码重要的概念,详情可查看本人之前博文文件和字符编码。本文讨论unicode和UTF8之间的转换,先简要介绍两个概念:unicode是将字符与码点(code point,一个整数)一一对应的编码方案;码点通常用\uXXXX或者U+XXXX的方式表示,XXXX是码点的十六进制;UTF8是unicode的一个具体编码方案,规定字符存储的方式;UTF8编码字节数可变,不存在大小端问题,互联网通信中常采用此种编码方式。
( j+ k5 o9 A$ v7 f9 q1 N回顾一下那成片的“汉字UTF8编码互转”网页所做的事情。以“中国”为例,两个汉字码点分别为20013和22269,十六进制表示4E2D 56FD,UTF8编码E4 B8 AD E5 9B BD。随手打开搜索结果中的http://www.ip138.com/utf8/,输入“中国”,点击“转换UTF-8”按钮,下方出现码点的十六进制编码4E2D 56FD(&#x可以理解为十六进制的前缀0x),并非UTF8编码。
% V- K6 J; ]. v+ d% kJavaScript的String对象有charCodeAt和codePointAt(兼容性不如charCodeAt)方法。根据这个函数,网页的转换工作可用如下代码实现:9 v: x+ D6 J( U% @4 X5 d& O) J
function encode(str) {
R# E. n$ k3 Y0 |! \5 [1 o% q O var result = '';' V6 l9 I5 ^" i5 g0 z
var len = str.length;
6 L& P$ u9 b2 c; }. B7 C for (var i = 0; i 调用encode(“中国”)或者其他字符串,将得到每个字符对应码点的十六进制。但这不是字符串的UTF8编码!
% B0 J' ~# k: V2 a4 v% b; G要拿到UTF8编码,需要在码点的基础上多走一步。先回顾unicode码点与UTF8的转换关系:/ ~, h4 H; V- J$ ~; z
unicode码点(十六进制)[/td]UTF-8(二进制) | 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 | 根据这个表,结合charCodeAt函数,可以写出字符串到UTF8编码的函数:
7 W& P) c! h2 G// 获取字符串的utf8字节流
( S. z( k0 I }# w" O' E% [function getUTF8Bytes(str) {& p% G( C3 k/ V( F
var bytes = [];
9 F) V- ~: S3 Y var len = str.length;4 I! A3 o- H3 z1 }+ ~6 R
for (var i = 0; i = 0x10000 && code > 18) | 0xf0); // 第一个字节
5 R; H- T, ?- W& l1 a0 L3 D7 S3 c bytes.push(((code >> 12) & 0x3f) | 0x80);
2 a D0 @' t7 Y7 P8 |2 I { bytes.push(((code >> 6) & 0x3f) | 0x80);
2 A+ B" \% ^3 D8 N" K' T bytes.push((code & 0x3f) | 0x80);( p; l+ |; P8 _$ P
} else if (code >= 0x800 && code > 12) | 0xe0);: G0 G* @* u, j% A0 V0 s
bytes.push(((code >> 6) & 0x3f) | 0x80);2 A, J- H, y4 c% ?
bytes.push((code & 0x3f) | 0x80);& \( F5 h- M$ U) N9 q. L! O% `
} else if (code >= 0x80 && code > 6) | 0xc0);- R5 o4 C: ~+ T- Y$ x. H
bytes.push((code & 0x3f) | 0x80);# F+ K6 W" q; D! e* E5 U$ a3 G
} else {
& h; C d [9 C! l" Z% U$ b' x bytes.push(code)4 D$ z! K6 J! s3 [3 c( [8 N3 v
}
- k' C# z& V4 O: ]5 P( e }
" H' L- Z: j) }8 A( \' o* z return bytes;$ g; N; }9 l$ y0 \
}+ D+ \% @1 O! Y
// 将字节流转换成16进制字符串, V) p! y, }2 c# y
function hexString(bytes) {
4 n, t2 u2 V, }! Y" ~9 X, _% v var arr = bytes.map(function (code) {
! M- D1 K9 c; I return (code).toString(16).toUpperCase();
6 q" y$ Q q1 d( s9 X9 W });: b; `( |5 r& f; Q+ b
return arr.join(' ');
. |, z1 r# d2 ~# \5 V, G$ I; q8 ~}4 J, d f$ P7 ], n8 E6 Y) {! D
function utf8(str) {. w* ~9 S: _8 b# B( A$ ?! D1 ^* j
return hexString(getUTF8Bytes(str));4 N- W/ ^! q, K. X) y9 Z0 \* d
}: f2 x8 N9 i1 J8 d; N
调用函数utf8,这才是JavaScript得到字符串的UTF8编码的正确姿势!从UTF8编码转换到字符串,做相反工作即可。
% }5 q! s/ J9 ] W. eAD:【国外VPS推荐】 Vultr全球16个数据中心,高速SSD硬盘,月付2.5$起,注册充10$送100$打赏赞(1) |
本帖子中包含更多资源
您需要 登录 才可以下载或查看,没有账号?立即注册
x
|