|
转载请注明文章出处:https://itlanyan.com/string-unicode-utf8-converter/
+ _& D- c: @* F: f; x6 R8 m想知道某个字符串的UTF8编码,图方便打算使用在线工具。坑爹的是,号称“UTF8汉字互转”的网页几乎全是字符串和unicode码点互转,并不提供与UTF8编码互转功能。没搞懂unicode码点(code point)和UTF8编码的关系,还大言不惭的说UTF8编码,真让人无语。
6 ^! S! Z* w, A8 T- h- K/ S
0 a G/ a6 G/ G0 Q
$ z) C8 Z: t8 x) b9 @4 f) `
: } x. i8 v( I
8 b! y, O. K7 a, l2 n6 }7 I k0 A( u9 A1 @2 s+ T
字符、字节和字节序,unicode和UTF8编码,是理解字符编码重要的概念,详情可查看本人之前博文文件和字符编码。本文讨论unicode和UTF8之间的转换,先简要介绍两个概念:unicode是将字符与码点(code point,一个整数)一一对应的编码方案;码点通常用\uXXXX或者U+XXXX的方式表示,XXXX是码点的十六进制;UTF8是unicode的一个具体编码方案,规定字符存储的方式;UTF8编码字节数可变,不存在大小端问题,互联网通信中常采用此种编码方式。; z/ l/ m# ~: k1 p
回顾一下那成片的“汉字UTF8编码互转”网页所做的事情。以“中国”为例,两个汉字码点分别为20013和22269,十六进制表示4E2D 56FD,UTF8编码E4 B8 AD E5 9B BD。随手打开搜索结果中的http://www.ip138.com/utf8/,输入“中国”,点击“转换UTF-8”按钮,下方出现码点的十六进制编码4E2D 56FD(&#x可以理解为十六进制的前缀0x),并非UTF8编码。
. p/ `: n) g, ^JavaScript的String对象有charCodeAt和codePointAt(兼容性不如charCodeAt)方法。根据这个函数,网页的转换工作可用如下代码实现:
8 k; E! r) r. R2 nfunction encode(str) {
4 F O9 u# o% v( ? var result = '';7 f$ R# g9 ?" W, n8 s$ E
var len = str.length;# r+ K# ?1 ^5 r7 A) N$ E
for (var i = 0; i 调用encode(“中国”)或者其他字符串,将得到每个字符对应码点的十六进制。但这不是字符串的UTF8编码!
1 U9 u8 w* g& Z8 H+ F3 R要拿到UTF8编码,需要在码点的基础上多走一步。先回顾unicode码点与UTF8的转换关系:
- F7 O& J* b) o, Junicode码点(十六进制)[/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编码的函数:; t. ^9 o5 [ I' y# n
// 获取字符串的utf8字节流
- n& f! s( H# r9 N" i& sfunction getUTF8Bytes(str) {+ M4 Z! d% v: }! B
var bytes = [];% I( @# b+ N, P4 }8 }
var len = str.length;# ~2 f- r0 l! x5 Y3 {" O
for (var i = 0; i = 0x10000 && code > 18) | 0xf0); // 第一个字节9 u5 e6 i; J5 @. g) k
bytes.push(((code >> 12) & 0x3f) | 0x80);; s1 Z. r( k* S
bytes.push(((code >> 6) & 0x3f) | 0x80); T1 ~9 u4 ~4 j! N
bytes.push((code & 0x3f) | 0x80);2 ` V( q# P$ k
} else if (code >= 0x800 && code > 12) | 0xe0);
# B. J/ P: T) R" {/ Q bytes.push(((code >> 6) & 0x3f) | 0x80);+ u: D% M" x+ D
bytes.push((code & 0x3f) | 0x80);
% g$ t* P7 c- J6 ]- `! |) U } else if (code >= 0x80 && code > 6) | 0xc0);9 w2 _; X) u( x, U
bytes.push((code & 0x3f) | 0x80);
D. U Z4 w% l( \7 E; U( M7 C } else {3 p0 \9 F! S1 W3 R5 v% @
bytes.push(code)
8 E! R. Y" A& R+ R* d }) N* \6 h8 W# z
}
& h" w9 K. a* [# N1 a return bytes;
- ]- q' \" o$ E5 J2 t. p}- W* K3 Y+ E0 F1 x( s
// 将字节流转换成16进制字符串2 `( X4 [: N2 x q; z; K
function hexString(bytes) {# A4 c9 R# L0 I" D3 n, t* M) r5 u
var arr = bytes.map(function (code) {
5 d. @" p5 S4 \8 Z return (code).toString(16).toUpperCase();
" k) H; l# T0 U: Q6 u });
6 g- \# i& i, m# c return arr.join(' ');
# \# d, C1 @- Y- @( Q0 w}/ ^+ A w. l7 K2 u
function utf8(str) {1 j3 A& F6 \+ i& [( |
return hexString(getUTF8Bytes(str));
/ l" o- y! y1 p" S8 N `( E6 N6 V}# n5 l* I2 b3 h( s1 [! C! M2 ~! W
调用函数utf8,这才是JavaScript得到字符串的UTF8编码的正确姿势!从UTF8编码转换到字符串,做相反工作即可。: Y) x, W1 S) Q' _/ ]7 N% d
AD:【国外VPS推荐】 Vultr全球16个数据中心,高速SSD硬盘,月付2.5$起,注册充10$送100$打赏赞(1) |
本帖子中包含更多资源
您需要 登录 才可以下载或查看,没有账号?立即注册
x
|