這是winter大大在前端階級訓練營第二周第二課給我們留的的作業,寫一個UTF8Encoding函數
怎么將一個Unicode編碼的中文轉為UTF8的字節碼嘞?
var str = '中';
var code = encodeURI(str);
console.log(code); // => %E4%B8%AD
有沒有發現得到了一個轉義后的字符串,而且這個字符串中的內容和我之前在上面得到的字節碼是一樣的~~~。
下面我們將%E4%B8%AD
轉為一個number數組。
var codeList = code.split('%');
codeList = codeList.map(item => parseInt(item,16));
console.log(codeList); // => [228, 184, 173]
如此簡單,有木有~~~
封裝成一個函數
function encodeUTF(text) {
const code = encodeURIComponent(text);
const bytes = [];
for (let i = 0; i < code.length; i++) {
const c = code.charAt(i);
if (c === '%') {
const hex = code.charAt(i + 1) + code.charAt(i + 2);
const hexVal = parseInt(hex, 16);
bytes.push(hexVal);
i += 2;
} else bytes.push(c.charCodeAt(0));
}
return bytes;
}
這個簡便方法的原理是什么?
這里就涉及到的URI
中的querystring
編碼的問題了。因為按照規定,URI中的querystring必須按照UTF8的編碼進行傳輸,而JavaScript是Unicode的,所以瀏覽器就給我們提供了一個方法,也就是encodeURI
/encodeURIComponent
方法。這個方法會講非英文字符
(這里考慮下,為什么是非英文字符?)先轉為UTF8的字節碼,然后前面加個%進行拼接,所以我們將漢字"中"
轉義下便得到了"%E4%B8%AD"
.
好吧,原理就這些,沒有其他的了。
不過,這種方法還有個缺點,那就是只會轉義非英文字符
,所以當我們需要將英文字符也格式化為UTF8編碼時,這個方法是達不到我們需求的,我們還需要額外的將英文字符也給轉義下。
那我想要解析回來應該怎么做哪?用decodeURI
/decodeURIComponent
就可以了。
var codeList = [228, 184, 173];
var code = codeList.map(item => '%'+item.toString(16)).join('');
decodeURI(code); // => 中