字符串的扩展
原书作者：阮一峰
原书地址：ECMASript 6入门
- 基本字符表示
- 字符串新方法
- 模板字符串
1. 基本字符表示
- 字符的unicode表示法
- JS允许采用\uxxxx形式来表示一个字符，其中xxxx为字符的unicode码
"\u0061" // "a"- 超过\u0000-\uFFFF的字符使用两个双字节形式表示
"\uD842\uDFB7" // "𠮷"- 码点放入大括号，可以正确解读字符
"\u20BB7" // " 7" (理解为\u20BB+7，而\u20BB不可打印) "\u{20BB7}" // "𠮷" "\u{41}\u{42}\u{43}" // "ABC"- 包括这种方法，JS有6中字符表示法
'\z' === 'z' // true '\172' === 'z' // true '\x7A' === 'z' // true '\u007A' === 'z' // true '\u{7A}' === 'z' // true
2. 字符串新方法
- codePointAt
- 功能：可以返回一个字符的码点（能够处理4字节字符，而charCodeAt不行）
var s = "𠮷"; s.length // 2 s.charAt(0) // '' s.charAt(1) // '' s.charCodeAt(0) // 55362 s.charCodeAt(1) // 57271 let s = '𠮷a'; s.codePointAt(0) // 134071 s.codePointAt(1) // 57271 s.codePointAt(2) // 97- 上述例子证明，在参数不恰当时仍然得不到想要的结果，可以使用for来解决
let s = '𠮷a'; for (let ch of s) { console.log(ch.codePointAt(0).toString(16)); } // 20bb7 // 61- 该方法可以测试一个字符是双字节还是四字节
function is32Bit(c) { return c.codePointAt(0) > 0xFFFF; } is32Bit("𠮷") // true is32Bit("a") // false - String.fromCodePoint
- 功能：返回码点对应的字符（弥补fromCharCode不识别大于0xFFFF字符的不足）
String.fromCharCode(0x20BB7) // "ஷ" String.fromCodePoint(0x20BB7) // "𠮷"- 接收多个参数时，返回对应的字符串
String.fromCodePoint(0x78, 0x1f680, 0x79) === 'x\uD83D\uDE80y' // true - at (提案)
- 功能：返回指定位置字符（支持四字节字符）
'𠮷'.charAt(0) // "\uD842" '𠮷'.at(0) // "𠮷" - normalize
- 功能：合成字符（O（\u004F）和ˇ（\u030C）合成Ǒ（\u004F\u030C））
'\u01D1'.normalize() === '\u004F\u030C'.normalize() - includes(),startsWith(),endsWith()
- includes() 返回布尔值，表示是否找到了参数字符串
- startsWith() 返回布尔值，表示参数字符串是否在原字符串头部
- endsWith() 返回布尔值，表示字符串是否在原字符串尾部
let s = 'Hello world!'; s.startsWith('Hello') // true s.endsWith('!') // true s.includes('o') // true s.startsWith('world', 6) // true s.endsWith('Hello', 5) // true s.includes('Hello', 6) // false // 支持第二个参数，endsWith与其他两个不同， // 它针对前n个字符，其他两个则从第n个开始到字符串结尾 - repeat()
- repeat返回一个新字符串，表示将原字符串重复n次
'x'.repeat(3) // "xxx" 'hello'.repeat(2) // "hellohello" 'na'.repeat(0) // "" - padStart(), padEnd() (ES2017)
- 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 ' - String.raw
- 功能：用来充当模板字符串的处理函数，返回一个斜杠都被转义（即斜杠前面再加一个斜杠）的字符串，对应于替换变量后的模板字符串
String.raw`Hi\n${2+3}!`; // "Hi\\n5!" String.raw`Hi\u000A!`; // 'Hi\\u000A!' String.raw`Hi\\n` // "Hi\\n" // 原字符串的斜杠已经转义，则raw不做处理
3. 模板字符串
模板字符串（templatestring）是增强版的字符串，用反引号（`）标识，
它可以当作普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量
// 传统模板
$('#result').append(
'There are <b>' + basket.count + '</b> ' +
'items in your basket, ' +
'<em>' + basket.onSale +
'</em> are on sale!'
);
// ES6 写法
$('#result').append(`
There are <b>${basket.count}</b> items
in your basket, <em>${basket.onSale}</em>
are on sale!
`);
模板字符串可以紧跟在一个函数名后面，该函数将被调用来处理这个模板字符串，这称为“标签模板”功能
alert`123`
// 等同于
alert(123)
let a = 5;
let b = 10;
tag`Hello ${ a + b } world ${ a * b }`;
// 等同于
tag(['Hello ', ' world ', ''], 15, 50);
// 如果模板字符里面有变量，就不是简单的调用了
// 而是会将模板字符串先处理成多个参数，再调用函数
