在日常的前端開發(fā)工作中，我們會經(jīng)常的與HTML、javascript、css等語言打交道，和一門真正的語言一樣，計算機語言也有它的字母表、語法、詞法、編碼方式等，在這里我簡單的談一下前端HTML與javascript日常工作中常碰到的編碼問題。

在計算機中，我們儲存的信息都是用二進制碼表示的。我們認(rèn)識的、屏幕上顯示的英文、漢字等符號和儲存用的二進制代碼的互相轉(zhuǎn)換，就是編碼。

有兩個基本概念需要說明，charset 和 character encoding：

charset?，字符集，也就是某個符號和某個數(shù)字映射關(guān)系的一個表，也就是它決定了107 是koubei 的 ‘a(chǎn)’，21475 是口碑的“口”，不同的表有不同的映射關(guān)系，如 ascii，gb2312，Unicode. 通過這個數(shù)字和字符的映射表，我們可以把一個二進制表示的數(shù)字轉(zhuǎn)換成某個字符。 chracter encoding?，編碼方式。例如，同是對于應(yīng)“口”的 21475 這個數(shù)，我們是用 \u5k3e3 表示呢，還是用 %E5%8F%A3 來表示呢？這就是由 character encoding 來決定的。

對于 ‘koubei.com’ 這樣的 字符串來說，是美國人的常用字符，他們就制定了一個 叫做ASCII 的字符集，全稱是 american standard code of information interchange 美國標(biāo)準(zhǔn)信息交換碼，用0–127這128個數(shù)字，（2的7次方，0×00-0×7f) 代表了123abc這樣的常用的128個字符。一共是 7 bits，再加上第一個是符號位，要用來去補碼反碼表示負(fù)數(shù)什么的，一共8 bits 構(gòu)成一個 byte。當(dāng)年美國人就是小氣了點，要是一開始就設(shè)計成一個 byte 是16 bits、32 bits，世界上會少很多問題，不過當(dāng)時，估計他們覺得 8 bits 就夠了，可以表示128個不同的字符呢！

介于計算機這玩意兒是美國人搞出來的，所以他們自己省事，把自家用的符號都編碼好了，用的挺爽的。但當(dāng)計算機開始國際化的時候，問題出來了，拿中國舉例吧，漢字就好幾萬，怎么辦？

現(xiàn)有的 8 bits 一個 byte 的系統(tǒng)是基礎(chǔ)，不能破壞，不能去改到 16 bits之類的，否則改動太大了，只能走另一條路：用多個 ascii 的字符去表示一個其他字符，也就是 MBCS ( Multi-Byte Character System，多字節(jié)字符系統(tǒng))。 有了這個 MBCS 的概念，我們可以表示更多個字符了，比如我們用 2 個 ascii 字符，就有 16 bits, 理論上有 2 的 16 次方 65536 個字符。但這些編碼怎么分配到字符上呢？比如口碑的”口”的 Unicode 編碼就是 21475，誰決定的呢？字符集，也就是剛剛介紹的charset。ascii就是最基礎(chǔ)的一個字符集，在此之上，我們有類似于 gb2312， big5這樣針對簡體中文和繁體中文的MBCS的字符集等等。終于有個叫 Unicode Consortium 的機構(gòu)，決定做一個囊括所有字符在內(nèi)的字符集（UCS, Universal Character Set）和對應(yīng)編碼方式的標(biāo)準(zhǔn)，即 Unicode。從1991年開始，它發(fā)布了第一版 Unicode 國際標(biāo)準(zhǔn)，ISBN 0-321-18578-1 ，國際標(biāo)準(zhǔn)化組織 ISO 也參與了這個的定制，ISO/IEC 10646 : the Universal Character Set?？傊?，Unicode 是個基本覆蓋了所有已經(jīng)存在的地球上的符號的字符標(biāo)準(zhǔn)了，現(xiàn)在正在被越來越廣泛的使用，ECMA 標(biāo)準(zhǔn)也規(guī)定，javascript語言的內(nèi)部字符使用 Unicode 標(biāo)準(zhǔn)（這意味著，javascript的變量名、函數(shù)名等是允許中文的！）。

對于身在中國的開發(fā)者來說，可能碰到比較多的問題就是 gbk,? gb2312, utf-8 之間轉(zhuǎn)換之類的問題了。嚴(yán)格的說這個說法不是很準(zhǔn)確，gbk，gb2312是字符集 (charset)，而 utf-8 是一種編碼方式 (character encoding) ，是 Unicode 標(biāo)準(zhǔn)中 UCS 字符集的一種編碼方式，因為使用 Unicode 字符集的網(wǎng)頁主要用UTF-8編碼，所以大家常常就把它們并列了，其實是不準(zhǔn)確的。

有了 Unicode 后，至少人類文明沒有碰到外星人之前，這是一把萬能鑰匙了，都用它吧。而現(xiàn)在使用最廣泛 Unicode 的編碼方式就是 UTF-8 (8-bit UCS/Unicode Transformation Format) 了，它有幾個特別好的地方：

1. 編碼 UCS 字符集，全世界通用
2. 是一種變長編碼方式（variable-length character encoding），兼容 ascii

第二點是個很大的優(yōu)點，它使得以前使用純 ascii 編碼的系統(tǒng)兼容，而且不會增加額外的存儲量（假設(shè)定長的編碼方式，規(guī)定每個字符由2個 bytes 組成，那么這時候 ascii 字符占用的存儲空間將增大一倍）。

要把 UTF-8 說清楚，引入一個表會更方便了:

U-00000000 – U-0000007F:??? 0xxxxxxx U-00000080 – U-000007FF:??? 110xxxxx 10xxxxxx U-00000800 – U-0000FFFF:??? 1110xxxx 10xxxxxx 10xxxxxx U-00010000 – U-001FFFFF:??? 11110xxx 10xxxxxx 10xxxxxx 10xxxxxx U-00200000 – U-03FFFFFF:??? 111110xx 10xxxxxx 10xxxxxx 10xxxxxx? 10xxxxxx U-04000000 – U-7FFFFFFF:??? 1111110x 10xxxxxx 10xxxxxx 10xxxxxx? 10xxxxxx 10xxxxxx

要看懂這個表呢，我們看前兩行就夠了

U-00000000 – U-0000007F: 0xxxxxxx 第一行是這樣的，意思是說，如果你發(fā)現(xiàn)一個utf-8編碼的 byte 的二進制碼是0xxxxxxx，是0開頭的， 即十進制的0-127之間，那么他就是單獨的這一 byte 代表一個字符，而且是擁有和 ascii 碼完全一樣的含義。其他所有的 utf8 編碼的二進制值都是用1開頭的1xxxxxxx，大于127的，而且都需要至少2 bytes才能代表一個符號。所以一個字節(jié)的第一位是一個開關(guān)，代表這個字符是不是一個 ascii 碼。這個就是剛才談到的兼容性，從英文定義上看，就是utf8編碼的兩個屬性：

UCS characters U+0000 to U+007F (ASCII) are encoded simply as bytes 0×00 to 0×7F (ASCII compatibility). This means that files and strings which contain only 7-bit ASCII characters have the same encoding under both ASCII and UTF-8. All UCS characters >U+007F are encoded as a sequence of several bytes, each of which has the most significant bit set. Therefore, no ASCII byte (0×00-0×7F) can appear as part of any other character.

然后我們看看第二行：

U-00000080 – U-000007FF:??? 110xxxxx 10xxxxxx 先看第一個字節(jié)：110xxxxx，它的含義是，我不是一個 ascii 碼（因為第一位不為0），我是一個多 bytes 字符的第一個 byte （第二位為1），我參與表示的這個字符是由2個 bytes 組成的（第三位為0），從第四位開始，就是字符的信息儲存的位置。 再看第二個字節(jié)：10xxxxxx，它的含義是：我不是一個 ascii 碼（因為第一位不為0），我不是一個多 bytes 字符的第一個 byte （第二位為0），第三位開始是字符的信息儲存的位置。

從這個例子中可以總結(jié)出來，utf-8編碼方式中，在一長串連續(xù)的二進制 byte 碼中，可能由2個至6個 bytes 來表示一個符號，那么相比較于用一個 byte 表示符號的 ascii 碼，我們需要空間來儲存兩個額外信息： 一，這個符號開始位置，一個“starter”的位置，用生物學(xué)上的話來說，就是蛋白質(zhì)翻譯時候起始密碼子AUG的位置了；二，這個符號使用的 bytes 數(shù)（其實如果每個符號都有 starter，這個長度是可以不提供的，但是提供長度信息增加了在部分 bytes 丟失時的容錯能力）。解決方案是：用一個 byte 的第二位是否是1來代表這一 byte 是否是一個字符的起始 byte （因為一個 byte 里面的第一位剛才已經(jīng)被使用了，0表示ascii碼，1表示非ascii )，即，一個多字節(jié)符號的第一 個bytes一定是 11xxxxxx，一個192到255之間的二進制數(shù)。接下來，從第三位開始，提供長度信息，第三位是0表示這個符號是2字節(jié)的，第三位開始每多一個1，字符占用的 bytes 數(shù)加一。utf-8 最多定義到了 6 字節(jié)字符，需要比 110xxxxx 這樣的表示2字節(jié)的starter多 4 個 1，所以這個starter就是 1111110x，如上表所示。 再看看英文定義的標(biāo)準(zhǔn)吧，表達(dá)的同樣的意思：

The first byte of a multibyte sequence that represents a non-ASCII character is always in the range 0xC0 to 0xFD and it indicates how many bytes follow for this character. All further bytes in a multibyte sequence are in the range 0×80 to 0xBF. This allows easy resynchronization and makes the encoding stateless and robust against missing bytes.

真正的信息位（即，真正的charset字符集中的數(shù)字信息），是直接用二進制的方式，依順序放在上面這個表的’x'上的。用我們中國程序員接觸最多的漢字來說吧，它們的編碼區(qū)間是在 U-00000800 – U-0000FFFF 之間的，從上面的表中可以查到，這個區(qū)間的 utf-8 編碼是用三個字節(jié)來表示的（這就是 utf-8 編碼的漢字會比每個字符占用2 bytes的 EUC-CN 編碼的 gb2312 字符集的漢字使用更多儲存空間的原因），還是用 口碑的”口”字舉例吧，口字在 Unicode 中的編號是這樣的： 口: 21475 == 0×53e3 ==? 二進制 101001111100011

在 javascript 中，run這段代碼（使用 firebug 的 console，或者編輯一個HTML將下列代碼插入一對 script 標(biāo)簽之間）：

alert(’\u53e3′);? //get ‘口’ alert(escape(’口’));? // get ‘%u53E3′ alert(String.fromCharCode(’21475′));? // get ‘口’ alert(’口’.charCodeAt(0));? // get ’21475‘ alert(encodeURI(’口’));? //get ‘%E5%8F%A3′

可以看到，string直接量可以用\u+十六進制 Unicode 碼的形式得到字符 ‘口’，而fromCharCode 方法接受 10 進制的 Unicode 碼，得到字符 ‘口’。

其中第二個alert得到的是 ‘%u7545′ , 這是一種不標(biāo)準(zhǔn)的Unicode編碼，是屬于 URI 的 Percent encoding 一部分，但這種使用方法已經(jīng)正式被 W3C 拒絕了，任何一個 RFC中都沒有這個標(biāo)準(zhǔn)，ECMA-262 標(biāo)準(zhǔn)中規(guī)定了 escape 的這種行為，估計也是暫時的。 比較有意思的是第五次alert得到的 ‘%E5%8F%A3′ 這是什么呢？怎么得到的呢？

這就是在URI上用的比較多的 Percent encoding，百分號編碼，RFC 3986 標(biāo)準(zhǔn)中規(guī)定的

本文來源于成都網(wǎng)站建設(shè)公司與成都網(wǎng)站設(shè)計制作公司-創(chuàng)新互聯(lián)成都公司！

分享標(biāo)題：HTML與javascript常碰到的編碼問題
URL分享：http://jinyejixie.com/news42/311192.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供外貿(mào)網(wǎng)站建設(shè)、微信公眾號、電子商務(wù)、標(biāo)簽優(yōu)化、云服務(wù)器、網(wǎng)站收錄

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)