charCodeAt與codePointAt的用法：

相同點(diǎn)：

• charCodeAt與codePointAt都是字符串實(shí)例上的方法瞒窒，用途都是用來返回指定索引位字符的Unicode編碼。

不同點(diǎn)：

• charCodeAt與codePointAt匹配索引位的規(guī)則不一樣。charCodeAt是根據(jù)碼元來匹配赠制，codePointAt是根據(jù)碼點(diǎn)來進(jìn)行匹配的蘸炸。

先舉個(gè)例子：

image

可以發(fā)現(xiàn)一個(gè)非常神奇的事情卤材。

有些中文字符 ?? 、 ?? 的長(zhǎng)度不為1济榨，并且charCodeAt與codePointAt對(duì)相同字進(jìn)行處理返回的結(jié)果卻是不同的。

這其中的原因就是charCodeAt是以一個(gè)碼元為一個(gè)索引绿映，codePointAt是以一個(gè)碼點(diǎn)為一個(gè)索引進(jìn)行處理的

Unicode使用16位二進(jìn)制來存儲(chǔ)文字擒滑。我們將一個(gè)16位的二進(jìn)制編碼叫做一個(gè)碼元（Code Unit），Unicode編碼范圍在0 - 2^16叉弦。也就是我們所說的占2個(gè)字節(jié)丐一。

由于技術(shù)的發(fā)展，Unicode對(duì)文字編碼進(jìn)行了擴(kuò)展卸奉，將某些文字?jǐn)U展到了32位（占用兩個(gè)碼元）钝诚，并且，將某個(gè)文字對(duì)應(yīng)的二進(jìn)制數(shù)字叫做碼點(diǎn)（Code Point）榄棵，Unicode編碼范圍在0 - 2^32凝颇，占4個(gè)字節(jié)。

特別要注意疹鳄，碼點(diǎn)可以是一個(gè)碼元拧略，也可以是兩個(gè)碼元。

字符串的length屬性返回的是碼元瘪弓。所以在對(duì)一些字符串如果要處理長(zhǎng)度的時(shí)候要注意這一點(diǎn)垫蛆。

?? 這個(gè)字的Unicode編碼是 \ud842\udfb7，占用了兩個(gè)碼元。

所以當(dāng)用charCodeAt(0)是匹配0位的碼元袱饭，也就是返回給我們55362川无。

當(dāng)用codePointAt(0)是匹配0位的碼元，codePointAt能識(shí)別出字符串的碼點(diǎn)虑乖，所以反回134071懦趋，反之將直接返回在那個(gè)索引處的編碼單元

??.codePointAt(1)為什么返回的是57271呢？

這是因?yàn)樗饕皇歉鶕?jù)碼元疹味，而匹配的規(guī)則是根據(jù)碼點(diǎn)的規(guī)則仅叫。如果后面兩位碼元是一個(gè)碼點(diǎn)，就會(huì)當(dāng)作一個(gè)碼點(diǎn)來處理糙捺。

總結(jié)

charCodeAt是以碼元為單位來處理的诫咱，也就是說按照每16位2進(jìn)制數(shù)為單位。一個(gè)16位2進(jìn)制數(shù)就是一位洪灯，所以處理不了Unicode擴(kuò)展編碼字符（32位2進(jìn)制）坎缭。他會(huì)把32位2進(jìn)制數(shù)當(dāng)成兩個(gè)16位2進(jìn)制數(shù)處理

codePointAt也是以碼元位單位來處理的。與charCodeAt不同的地方是婴渡，當(dāng)處理到當(dāng)前位碼元時(shí)幻锁，如果超過了16位2進(jìn)制數(shù)值的上線，他就明白這是一個(gè)32位2進(jìn)制數(shù)边臼，就會(huì)以32位2進(jìn)制數(shù)當(dāng)作一個(gè)來處理哄尔。

可以通過codePointAt來判斷當(dāng)前字符是是32位的(倆個(gè)碼元)還是16位的（單個(gè)碼元）

function is32bit(char, i) {
    //如果碼點(diǎn)大于了16位二進(jìn)制的最大值，則其是32位的
    return char.codePointAt(i) > 0xffff;
}

同樣的柠并，也可以通過這個(gè)方法來判斷以字符串真實(shí)的長(zhǎng)度（碼點(diǎn)的長(zhǎng)度）

function getLengthOfCodePoint(str) {
    var len = 0;
    for (let i = 0; i < str.length; i++) {
        //i在索引碼元
        if (is32bit(str, i)) {
            //當(dāng)前字符串岭接，在i這個(gè)位置，占用了兩個(gè)碼元
            i++;
        }
        len++;
    }
    return len;
}

轉(zhuǎn)自：
https://www.cnblogs.com/yongG/p/12153646.html

相關(guān)參考
“短”化你的代碼
遍?布?互?聯(lián)?網(wǎng)?的?神?秘?電?波?是?如?何?制?作?出?來?的?臼予？?
Unicode Consortium
Unicode 字符表
Web瀏覽器和其他應(yīng)用程序中對(duì)Unicode的支持