JS中unicode和utf 8的轉換

2022-07-01 12:45:20 字數 2785 閱讀 4210

最近公司找了幾個py寫後端專案,後端介面中返回'\xe6\x88\x91\xe4\xbb\xac'類似的編碼,我看著就很好奇,於是將此段編碼過的字元輸入chrome的控制台,結果如下:

很明顯,由於解釋錯誤出現了亂碼問題。。。

在網上一番搜尋發現,這就是utf-8編碼,本著好奇,就想知道unicode和utf-8之間是如何轉換的。。。至於utf-8和unicode的區別,我只強調一點utf-8是 unicode 的實現方式之一,具體的話大家網上自行查詢,這裡提供我參考的文章 字元編碼筆記:ascii,unicode 和 utf-8,下面我總結下在js中這兩種編碼之間如何轉換

我們知道在js中,encodeuri和encodeuricomponent函式將uri轉為utf-8編碼:

> encodeuricomponent('深圳華強')

< "%e6%b7%b1%e5%9c%b3%e5%8d%8e%e5%bc%ba"

在網上驗證下沒問題:

*/function encodeutf8 (str = '深圳華強')

// ret = ["e6", "b7", "b1", "e5", "9c", "b3", "e5", "8d", "8e", "e5", "bc", "ba"]

return ret.map(el => parseint(el, 16)) // [230, 183, 177, 229, 156, 179, 229, 141, 142, 229, 188, 186]

}

/**

* * @param arr }

* @return

*/function decodeutf8 (arr = [230, 183, 177, 229, 156, 179, 229, 141, 142, 229, 188, 186]) `, '')

return decodeuricomponent(str) // '深圳華強'

}

> encodeutf8()

< [230, 183, 177, 229, 156, 179, 229, 141, 142, 229, 188, 186]

> decodeutf8()

< "深圳華強"

最後回到我們開頭的問題,'\xe6\x88\x91\xe4\xbb\xac'到底代表什麼意思?

我嘗試很很多種方法,發現只要js識別到'\xe6\x88\x91\xe4\xbb\xac'馬上就進行解碼了,根本沒有機會操作。。。最後我發現將其中\要先轉義處理:'\xe6\x88\x91\xe4\xbb\xac',然後就好處理了,如果這個東西要前端要展示的話,只能暫時求助後端同學提前對反斜槓進行轉移處理了。。。

let reg = /\\x/g

console.log('\\xe6\\x88\\x91\\xe4\\xbb\\xac') // \xe6\x88\x91\xe4\xbb\xac

console.log('\\xe6\\x88\\x91\\xe4\\xbb\\xac'.replace(reg, '%')) // %e6%88%91%e4%bb%ac

console.log(decodeuricomponent('\\xe6\\x88\\x91\\xe4\\xbb\\xac'.replace(reg, '%'))) // 我們

對於昨天結尾遺留的問題,我找到了不完美的解決方案:ecmascript 6 入門 string.raw()

es6 還為原生的 string 物件,提供了乙個raw()方法。該方法返回乙個斜槓都被轉義(即斜槓前面再加乙個斜槓)的字串,往往用於模板字串的處理方法

string.raw`hi\n$!`

// 實際返回 "hi\\n5!",顯示的是轉義後的結果 "hi\n5!"

string.raw`hi\u000a!`;

// 實際返回 "hi\\u000a!",顯示的是轉義後的結果 "hi\u000a!"

解決方案跟昨天後端童鞋解決方案一樣,通過string.raw對反斜槓\進行轉義,如下:

let reg = /\\x/g

let str = string.raw`\xe6\x88\x91\xe4\xbb\xac`

// 實際返回 "\\xe6\\x88\\x91\\xe4\\xbb\\xac",顯示的是轉義後的記過 "\xe6\x88\x91\xe4\xbb\xac"

// 後續的操作就跟上邊一樣了,string.raw缺陷就是沒辦法傳入變數...

let str = '\xe6\x88\x91\xe4\xbb\xac'

string.raw`$`

// 返回 "æˆ『们" 相當於還是解析str了,導致string.raw失效了

unicode和utf8的關係

很久以前儲存的,別人寫的但是很明了 很久很久以前,有一群人,他們決定用8個可以開合的電晶體來組合成不同的狀態,以表示世界上的萬物。他們看到8個開關狀態是好的,於是他們把這稱為 位元組 再後來,他們又做了一些可以處理這些位元組的機器,機器開動了,可以用位元組來組合出很多狀態,狀態開始變來變去。他們看到...

Unicode和utf 8的區別

很久以前儲存的,別人寫的但是很明了 很久很久以前,有一群人,他們決定用8個可以開合的電晶體來組合成不同的狀態,以表示世界上的萬物。他們看到8個開關狀態是好的,於是他們把這稱為 位元組 再後來,他們又做了一些可以處理這些位元組的機器,機器開動了,可以用位元組來組合出很多狀態,狀態開始變來變去。他們看到...

unicode和utf8編碼詳解

大家都知道計算機只能處理數字,所以在計算機中其他字元都需要先轉換為數字0和1才能處理。每8個bit作為乙個位元組,乙個位元位表示乙個乙個字元,乙個位元組就能表示255個字元。而乙個位元組足以表示所有的美國字元,所以美國人編寫了自己的ascii編碼,作為自己的統一編碼。但是漢字不止255個,所以中國用...