ES6知识点整理

[toc]

03 字符串的拓展

03.1 字符的Unicode表示法

略

03.2 codePointAt()

略

03.3 String.fromCodePoint()

略

03.4 字符串的遍历器接口

ES6为字符串添加了遍历器接口，使其可以使用 for...of 循环遍历。

for (let codePoint of 'foo'){
    console.log(codePoint);
}
//f
//o
//o

03.5 at()

略

03.6 normalize()

略

03.7 includes()、startWith()、endWith()

以往的js中只有indexOf()可以用来判断一个字符串是否存在于另一个字符串中，ES6提供了三种新方法：
inculdes() 返回布尔值，表示是否找到参数字符串
starWith() 返回布尔值，表示参数字符串是否在源字符串的头部
endWith() 返回布尔值，表示参数字符串是否在源字符串的尾部

let s = "Hello World";

s.includes('llo');//true
s.startsWith('He');//true
s.endsWith('ld');//true

//3个方法都支持第二个参数，表示开始搜索的位置
s.includes('llo',5);//false
s.startsWith('He',3);//false
s.endsWih('el',3);//true

endsWith的第二个参数略有不同，表示的是前n个字符，而includes和startsWith表示从第n个字符到结尾之间。

03.8 repeat()

repeat方法返回一个新字符串，表示将原字符串重复n次。若参数是小数会取整，是负数或Infinity会报错,NaN等同于0。但参数如果是0到-1的小数，会先取整为0，不会报错。

'abc'.repeat(3);//abcabcabc
'lol'.repeat(2.1);//lollol
'hello'.repeat(NaN);//hello

我们可以使用repeat方法来实现一些常用的功能，比如单行文字的右对齐：

let a = '欢迎光临', b = '狗子';
function fullLeft(str,leng=25){
    console.log("  ".repeat((Math.max(str.length,len) - str.length)) + str);
}
fullLeft(a);//                                          欢迎光临
fullLeft(b);//                                             狗子

03.9 padStart()、padEnd()

ES2017提供了字符串补全的功能：padStart用于头部补全，padEnd用于尾部补全。
方法接受两个参数，第一个参数表示字符串的最小长度，小于这个长度会补全；第二个参数表示用来补全的字符串。

'x'.padStart('6','abc');//abcabx
'x'.padEnd('6','abc');//xabcab

//若最小长度小于字符串实际长度，则返回原字符串
'abcabc'.padStart(3);//abcabc

//若省略第二个参数会用空格补全
'x'.padStart(4);//'   x'

03.10 模版字符串

模版字符串用反引号作为标识，可以当做普通字符串，多行字符串，或在字符串中插入变量，并且支持模版字符串的嵌套。

let name = 'Jelly';
console.log(`Hello, ${name}`);//Hello, Jelly

模版字符串可以用于dom模版的添加：

let node = '', num = 10;
for(let i = 0; i < 10; i++){
    node = `${node}<li>${i}</li>`;
}
document.body.innerHTML = node;