本文参考自《ECMAScript 6 入门》——阮一峰
ES6加强了对Unicode的支持,并且扩展了字符串对象。
1.字符串的Unicode表示法
js允许采用\uxxxx形式表示一个字符,其中“xxxx”表示字符的码点。
但是,这种表示法只限于\u0000——\uFFFF之间的字符。超出这个范围的字符,必须用两个双字节的形式表达(比如一些生僻字)。
同时:
如果直接在\u后面跟上超过0xFFFF的数值(比如\u20BB7),js会理解成“\u20BB+7”。
ES6对这点做出了改进,只要将码点放入大括号,就能正确解读该字符。
有了这种表示法后,JS共有6种方法可以表示一个字符。
'\z' === 'z';//true
'\172' === 'z';//true 8进制
'\x7A' === 'z';//true 16进制
'\u007A' === 'z';//true UTF-16编码
'\u{7A}' === 'z';//true 大括号表示法
2.codePointAt()
js内部,字符以UTF-16的格式存储,每个字符固定为2个字节,对于那些需要4个字节存储的字符(unicode码点大于0xFFFF的字符),JS会认为它们是两个字符。
汉字“?”的码点是0x20BB7,UTF-16的编码为0xD842 0xDFB7(十进制为55362 57271),需要4个字节存储。对于这种4个字节的字符,JS不能正确处理,字符串长度会误判为2,而且charAt方法无法读取整个字符,charCodeAt方法只能分别返回前两个字节和后两个字节的值。
ES6提供了codePointAt方法,能够正确处理4个字节储存的字符,返回一个字符的码点。
codePointAt方法的参数,是字符在字符串中的位置(从0开始)。上面的代码中,js将“?a”视为3个字符,codePointAt方法在第一个字符上,正确的识别了“?”,返回了它的十进制码点134071(即16进制20BB7)。在第二个字符(即“?”的后两个字节)和第三个字符“a”上,codePointAt方法的结果与charCodeAt方法相同。
codePointAt方法返回的是码点的十进制值,如果想要十六进制的值,可以使用toString方法转换。
codePointAt方法是测试一个字符由两个字节还是由四个字节组成的最简单方法。
3.String.fromCodePoint()
ES5提供String.fromCharCode方法,用于从码点返回对应字符,但是这个方法不能识别32位的UTF-16字符(unicode编号大于0xFFFF)。
ES6提供了String.fromCodePoint方法可以识别大于0xFFFF的字符,弥补了String.fromCharCode方法的不足,在作用上,正好与codePointAt方法相反。
如果String.fromCodePoint方法有多个参数,则它们会被合并成一个字符串返回。
注意:fromCodePoint方法定义在String对象上,而codePointAt方法定义在字符串的实例对象上。
4.字符串的遍历接口
ES6为字符串添加了遍历器接口,使得字符串可以被for...of循环遍历。
除了遍历字符串,这个遍历器最大的优点是可以识别大于0xFFFF的码点,传统的for循环无法识别这样的码点。
6.at()
ES5对字符串对象提供charAt方法,返回字符串给定位置的字符。该方法不能识别码点大于0xFFFF的字符。
ES7提供了字符串实例的at方法,可以识别unicode编号大于0xFFFF的字符,返回正确的字符,Chrome浏览器已经支持该方法。
7.normalize()
为了表示语调和重音符号,unicode提供了两种方法。一种是直接提供带重音符号的字符
另一种是提供合成符号,即原字符与重音符号的合成,两个字符合成一个字符,比如(\u004f)和(\u030c)合成(\u004f\u030c)
(不知道为什么我单独的\u030c显示不出来,,,)
这两种方法在视觉和语义上都等价,但是js不能识别。
上面代码表示,js将合成字符视为两个字符,导致两种表示方法不相等。
ES6提供字符串实例的normalize()方法,用来将字符的不同表示方法统一为同样的形式,这称为unicode正规化。
normalize方法可以接受4个参数。
7.includes(),startsWith(),endsWith()
传统上,js只有indedOf方法,可以用来确定一个字符串是否包含在另一个字符串中,ES6又提供了三种新方法。
——includes():返回布尔值,表示是否找到了参数字符串。
——startsWith():返回布尔值,表示参数字符串是否在源字符串的头部。
——endsWith():返回布尔值,表示参数字符串是否在源字符串的尾部。
var s = "hello world!";
s.startsWith('hello');//true
s.endsWith('!');//true
s.includes('o');//true
这三个方法都支持第二个参数,表示开始搜索的位置。
var s = "hello world!";
s.startsWith('world',6);//true
s.endsWith('hello',5);//true
s.includes('hello',5);//false
上面的代码表示,当使用第二个参数n时,endsWith的行为与其他两个方法有所不同。它针对前n个字符,而其他方法针对从第n个位置直到字符串结束。