背景
- 在JavaScript中允许采用Unicode码点表示一个字符
"\u0061"
// "a"
- 但是这个表示方法也只限于码点在\u0000~\uFFFF之间的，超出这个范围必须用双字节表示。
"\uD842\uDFB7"
// "𠮷"
"\u20BB7"
// " 7"
- 上面代码表示，如果直接在\u后面跟上超过0xFFFF的数值（比如\u20BB7），JavaScript会理解成\u20BB+7。由于\u20BB是一个不可打印字符，所以只会显示一个空格，后面跟着一个7。
- 在ES6中我们可以使用大括号来正确解读字符
"\u{20BB7}"
// "𠮷"
"\u{41}\u{42}\u{43}"
// "ABC"
let hello = 123;
hell\u{6F} // 123
'\u{1F680}' === '\uD83D\uDE80'
// true
codePointAt
- 在Javascript内部，所有的字符都utf-16的格式存储，每个字符占用两字节，对于那些需要四个字节存储的字符，会被认为是两个字符
var s = "𠮷";
s.length // 2
s.charAt(0) // ''
s.charAt(1) // ''
s.charCodeAt(0) // 55362
s.charCodeAt(1) // 57271
- ES6提供了codePointAt的方法可以正确处理四个字节的字符
var s = '𠮷a';
s.codePointAt(0) // 134071
s.codePointAt(1) // 57271
s.codePointAt(2) // 97
- 该函数对两个字节的字符与charCodeAt没有区别，处理四字节字符字节是可以正确解读，但是如上述代码，该方法的参数还是不正确，比如a的下标应该为2，此时最好的解决方法就是是用for...of循环。
var s = '𠮷a';
for (let ch of s) {
console.log(ch.codePointAt(0).toString(16));
}
// 20bb7
// 61
String.fromCodePoint()
- ES5提供String.fromCharCode方法，用于从码点返回对应字符，但是这个方法不能识别32位的UTF-16字符（Unicode编号大于0xFFFF）
String.fromCharCode(0x20BB7)
// "ஷ"
- ES6提供了String.fromCodePoint方法，可以识别大于0xFFFF的字符，弥补了String.fromCharCode方法的不足。在作用上，正好与codePointAt方法相反。
String.fromCodePoint(0x20BB7)
// "𠮷"
String.fromCodePoint(0x78, 0x1f680, 0x79) === 'x\uD83D\uDE80y'
// true
- 注意，fromCodePoint方法定义在String对象上，而codePointAt方法定义在字符串的实例对象上。
字符串的遍历器接口
- ES6为字符串新增了遍历器接口，该接口使得字符串可以使用for...of循环读取字符
for (let codePoint of 'foo') {
console.log(codePoint)
}
// "f"
// "o"
// "o"
- 除了遍历器字符串，这个接口最大的优点是可以处理大于\uFFFF码点的字符
var text = String.fromCodePoint(0x20BB7);
for (let i = 0; i < text.length; i++) {
console.log(text[i]);
}
// " "
// " "
for (let i of text) {
console.log(i);
}
// "𠮷"
includes(), startsWith(), endsWith()
- 定义
- 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', 6) // false
- 第二个的参数n表示前n个参数
- 其他俩个参数n表示有第几个字符开始查找。
repeat()
repeat方法返回一个新字符串，其内容为原字符串的重复。
'x'.repeat(3) // "xxx"
'hello'.repeat(2) // "hellohello"
'na'.repeat(0) // ""
padStart()，padEnd()
- 这俩个函数用于补齐字符串，如果某个字符串不够指定长度，会在头部或尾部补全。padStart()用于头部补全，padEnd()用于尾部补全。
'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax'
'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba'
- 如果省略第二个参数，默认使用空格补全长度。
'x'.padStart(4) // ' x'
'x'.padEnd(4) // 'x '
- padStart的常见用途是为数值补全指定位数。下面代码生成10位的数值字符串。
'1'.padStart(10, '0') // "0000000001"
'12'.padStart(10, '0') // "0000000012"
'123456'.padStart(10, '0') // "0000123456"
- 另一个用途是提示字符串格式
'12'.padStart(10, 'YYYY-MM-DD') // "YYYY-MM-12"
'09-12'.padStart(10, 'YYYY-MM-DD') // "YYYY-09-12"
网友评论