ES6學(xué)習(xí)筆記03——字符串的擴(kuò)展

字符的 Unicode 表示法

JavaScript 允許采用\uxxxx形式表示一個字符顽决,其中xxxx表示字符的 Unicode 碼點。

"\u0061"
// "a"

但是导匣,這種表示法只限于碼點在\u0000~\uFFFF之間的字符才菠。超出這個范圍的字符,必須用兩個雙字節(jié)的形式表示贡定。

"\uD842\uDFB7"
// "??"

"\u20BB7"
// " 7"

上面代碼表示赋访,如果直接在\u后面跟上超過0xFFFF的數(shù)值(比如\u20BB7),JavaScript 會理解成\u20BB+7。由于\u20BB是一個不可打印字符蚓耽,所以只會顯示一個空格渠牲,后面跟著一個7。
ES6 對這一點做出了改進(jìn)步悠,只要將碼點放入大括號签杈,就能正確解讀該字符。

"\u{20BB7}"
// "??"

"\u{41}\u{42}\u{43}"
// "ABC"

let hello = 123;
"\u{6F}";//o
hell\u{6F} // 123

'\u{1F680}' === '\uD83D\uDE80'
// true

上面代碼中鼎兽,最后一個例子表明答姥,大括號表示法與四字節(jié)的 UTF-16 編碼是等價的。
有了這種表示法之后谚咬,JavaScript 共有 6 種方法可以表示一個字符鹦付。

'\z' === 'z'  // true
'\172' === 'z' // true
'\x7A' === 'z' // true
'\u007A' === 'z' // true
'\u{7A}' === 'z' // true

codePointAt()

JavaScript 內(nèi)部,字符以 UTF-16 的格式儲存择卦,每個字符固定為2個字節(jié)敲长。對于那些需要4個字節(jié)儲存的字符(Unicode 碼點大于0xFFFF的字符),JavaScript 會認(rèn)為它們是兩個字符互捌。

var s = "??";

s.length // 2
s.charAt(0) // ''
s.charAt(1) // ''
s.charCodeAt(0) // 55362
s.charCodeAt(1) // 57271

上面代碼中潘明,漢字“??”(注意,這個字不是“吉祥”的“吉”)的碼點是0x20BB7秕噪,UTF-16 編碼為0xD842 0xDFB7(十進(jìn)制為55362 57271)钳降,需要4個字節(jié)儲存。對于這種4個字節(jié)的字符腌巾,JavaScript 不能正確處理遂填,字符串長度會誤判為2,而且charAt方法無法讀取整個字符澈蝙,charCodeAt方法只能分別返回前兩個字節(jié)和后兩個字節(jié)的值吓坚。
ES6 提供了codePointAt方法,能夠正確處理 4 個字節(jié)儲存的字符灯荧,返回一個字符的碼點礁击。

let s = '??a';

s.codePointAt(0) // 134071
s.codePointAt(1) // 57271

s.codePointAt(2) // 97

codePointAt方法的參數(shù),是字符在字符串中的位置(從 0 開始)逗载。上面代碼中哆窿,JavaScript 將“??a”視為三個字符,codePointAt 方法在第一個字符上厉斟,正確地識別了“??”挚躯,返回了它的十進(jìn)制碼點 134071(即十六進(jìn)制的20BB7)。在第二個字符(即“??”的后兩個字節(jié))和第三個字符“a”上擦秽,codePointAt方法的結(jié)果與charCodeAt方法相同码荔。
總之漩勤,codePointAt方法會正確返回 32 位的 UTF-16 字符的碼點。對于那些兩個字節(jié)儲存的常規(guī)字符缩搅,它的返回結(jié)果與charCodeAt方法相同越败。
codePointAt方法返回的是碼點的十進(jìn)制值,如果想要十六進(jìn)制的值誉己,可以使用toString方法轉(zhuǎn)換一下眉尸。

let s = '??a';

s.codePointAt(0).toString(16) // "20bb7"
s.codePointAt(2).toString(16) // "61"

你可能注意到了域蜗,codePointAt方法的參數(shù)巨双,仍然是不正確的。比如霉祸,上面代碼中筑累,字符a在字符串s的正確位置序號應(yīng)該是 1,但是必須向codePointAt方法傳入 2丝蹭。解決這個問題的一個辦法是使用for...of循環(huán)慢宗,因為它會正確識別 32 位的 UTF-16 字符。

let s = '??a';
for (let ch of s) {
  console.log(ch.codePointAt(0).toString(16));
}
// 20bb7
// 61

codePointAt方法是測試一個字符由兩個字節(jié)還是由四個字節(jié)組成的最簡單方法奔穿。

function is32Bit(c) {
  return c.codePointAt(0) > 0xFFFF;
}

is32Bit("??") // true
is32Bit("a") // false

String.fromCodePoint()

ES5 提供String.fromCharCode方法镜沽,用于從碼點返回對應(yīng)字符,但是這個方法不能識別 32 位的 UTF-16 字符(Unicode 編號大于0xFFFF)贱田。

String.fromCharCode(0x20BB7)
// "?"

上面代碼中缅茉,String.fromCharCode不能識別大于0xFFFF的碼點,所以0x20BB7就發(fā)生了溢出男摧,最高位2被舍棄了,最后返回碼點U+0BB7對應(yīng)的字符,而不是碼點U+20BB7對應(yīng)的字符殖侵。
ES6 提供了String.fromCodePoint方法彰檬,可以識別大于0xFFFF的字符,彌補了String.fromCharCode方法的不足乔询。在作用上樟插,正好與codePointAt方法相反。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末竿刁,一起剝皮案震驚了整個濱河市黄锤,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌们妥,老刑警劉巖猜扮,帶你破解...
    沈念sama閱讀 218,682評論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異监婶,居然都是意外死亡旅赢,警方通過查閱死者的電腦和手機(jī)齿桃,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,277評論 3 395
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來煮盼,“玉大人短纵,你說我怎么就攤上這事〗┛兀” “怎么了香到?”我有些...
    開封第一講書人閱讀 165,083評論 0 355
  • 文/不壞的土叔 我叫張陵,是天一觀的道長报破。 經(jīng)常有香客問我悠就,道長,這世上最難降的妖魔是什么充易? 我笑而不...
    開封第一講書人閱讀 58,763評論 1 295
  • 正文 為了忘掉前任梗脾,我火速辦了婚禮,結(jié)果婚禮上盹靴,老公的妹妹穿的比我還像新娘炸茧。我一直安慰自己,他們只是感情好稿静,可當(dāng)我...
    茶點故事閱讀 67,785評論 6 392
  • 文/花漫 我一把揭開白布梭冠。 她就那樣靜靜地躺著,像睡著了一般改备。 火紅的嫁衣襯著肌膚如雪控漠。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,624評論 1 305
  • 那天绍妨,我揣著相機(jī)與錄音润脸,去河邊找鬼。 笑死他去,一個胖子當(dāng)著我的面吹牛毙驯,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播灾测,決...
    沈念sama閱讀 40,358評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼爆价,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了媳搪?” 一聲冷哼從身側(cè)響起铭段,我...
    開封第一講書人閱讀 39,261評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎秦爆,沒想到半個月后序愚,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,722評論 1 315
  • 正文 獨居荒郊野嶺守林人離奇死亡等限,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,900評論 3 336
  • 正文 我和宋清朗相戀三年爸吮,在試婚紗的時候發(fā)現(xiàn)自己被綠了芬膝。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,030評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡形娇,死狀恐怖锰霜,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情桐早,我是刑警寧澤癣缅,帶...
    沈念sama閱讀 35,737評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站哄酝,受9級特大地震影響友存,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜炫七,卻給世界環(huán)境...
    茶點故事閱讀 41,360評論 3 330
  • 文/蒙蒙 一爬立、第九天 我趴在偏房一處隱蔽的房頂上張望钾唬。 院中可真熱鬧万哪,春花似錦、人聲如沸抡秆。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,941評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽儒士。三九已至的止,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間着撩,已是汗流浹背诅福。 一陣腳步聲響...
    開封第一講書人閱讀 33,057評論 1 270
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留拖叙,地道東北人氓润。 一個月前我還...
    沈念sama閱讀 48,237評論 3 371
  • 正文 我出身青樓,卻偏偏與公主長得像薯鳍,于是被迫代替她去往敵國和親咖气。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,976評論 2 355

推薦閱讀更多精彩內(nèi)容