返回

JavaScript 字符编码新方法

前端

JavaScript 字符编码的演进

在 JavaScript 中,处理 Unicode 字符是一个常见的需求。早期,我们使用 String.prototype.charCodeAt() 和 String.fromCharCode() 这两个方法来处理 Unicode 字符。charCodeAt() 方法可以将一个字符转换为它的 Unicode 码点,而 fromCharCode() 方法可以将一个 Unicode 码点转换为一个字符。

然而,这两个方法在处理多字节字符时存在一些问题。比如,对于一个双字节字符,charCodeAt() 方法会返回两个 Unicode 码点,而 fromCharCode() 方法会将这两个码点组合成一个字符。这可能会导致一些意外的结果。

为了解决这些问题,ES6 引入了两个新的方法:String.prototype.codePointAt() 和 String.fromCodePoint()。这两个方法可以正确地处理多字节字符,并且不会出现上述的问题。

String.prototype.codePointAt() 和 String.fromCodePoint() 的使用

String.prototype.codePointAt() 方法可以获取一个字符串中指定位置的字符的 Unicode 码点。该方法的参数是一个索引值,表示要获取字符的位置。如果索引值超出字符串的长度,则返回 undefined。

const str = 'Hello, world!';
console.log(str.codePointAt(0)); // 72
console.log(str.codePointAt(1)); // 101
console.log(str.codePointAt(2)); // 108
console.log(str.codePointAt(3)); // 108
console.log(str.codePointAt(4)); // 111

String.fromCodePoint() 方法可以将一个或多个 Unicode 码点转换为一个字符串。该方法的参数可以是一个 Unicode 码点,也可以是一个数组。如果参数是一个数组,则会将数组中的每个码点转换为一个字符,并组合成一个字符串。

console.log(String.fromCodePoint(72)); // 'H'
console.log(String.fromCodePoint(101)); // 'e'
console.log(String.fromCodePoint(108)); // 'l'
console.log(String.fromCodePoint(108)); // 'l'
console.log(String.fromCodePoint(111)); // 'o'
console.log(String.fromCodePoint(72, 101, 108, 108, 111)); // 'Hello'

String.prototype.codePointAt() 和 String.fromCodePoint() 与 String.prototype.charCodeAt() 和 String.fromCharCode() 的比较

String.prototype.codePointAt() 和 String.fromCodePoint() 与 String.prototype.charCodeAt() 和 String.fromCharCode() 的主要区别在于,前两者可以正确地处理多字节字符,而后两者不能。

在处理单字节字符时,这两个方法组是等价的。但是,在处理多字节字符时,String.prototype.charCodeAt() 和 String.fromCharCode() 会出现问题。

例如,对于一个双字节字符,charCodeAt() 方法会返回两个 Unicode 码点,而 fromCharCode() 方法会将这两个码点组合成一个字符。这可能会导致一些意外的结果。

结论

String.prototype.codePointAt() 和 String.fromCodePoint() 是处理 Unicode 字符的推荐方法。这两个方法可以正确地处理多字节字符,并且不会出现上述的问题。