ES6字符串模板和字符串扩展的方法
字符串模板
模板字符串是增强版的字符串,用反引号标识。符号在键盘数字1左边，它可以当作普通字符串使用,也可以用来定义多行字符串,或者在字符串中嵌入变量,用法是${变量名}。
先来看个字符串拼接的例子:
看下结果:
有了模板字符串后就不用拼接得这么痛苦，咱们可以直接在字符串里嵌入变量，如下:
结果也是一样的。
includes方法
ES6里字符串新增的方法：includes方法。ES6以前我们查找字符串里是否包含指定的子串，我们是用字符串的indexOf方法，返回子串首次出现的索引位置，如果没查找到就返回-1，如下例:
ES6新增的字符串方法includes方法返回的是一个布尔值，找到了就返回true,否则返回false,还是这个例子:
startsWith、endsWith和contains方法
ES6里字符串新增的方法：startsWith、endsWith和contains.
startsWith( ):返回布尔值true或false,表示参数字符串是否在源字符串的头部。
endsWith( ):返回布尔值true或false,表示参数字符串是否在源字符串的尾部.
contains( ):返回布尔值true或false,表示是否找到了参数字符串.
var s =“Hello world!
s.startsWith (“Hello”) //true
s.endsWith(”!”) //true
s.contains(“o”) //true
var str =‘aaa.png’;
console.log(str.endsWith(‘png’)); //true
这三个方法都支持第二个参数,表示开始搜索的位置。
var s = “Hello world!”;
s.startswith(“o”,4) //true
s.endswith(“o”,8) //true
s.contains(“o”,8) //false
repeat方法
ES6里字符串新增了repeat方法，str.repeat(n)返回一个新字符串,表示将原字符串str重复n次。来看个例子:
padStart和padEnd方法
ES6里字符串新增的方法padStart和padEnd方法分别表示字符串向前填充和向后填充。语法如下:
往前填充 str.padStart(整个字符串的长度,填充东西)
往后填充 str.padEnd(整个字符串的长度,填充东西)
比如现在有个需求，需要向字符串’a’前面填充字符串’xxx’也就是变成字符串’xxxa’
我们发现这样每次向前填充还要数字符串的长度，很累,我们可以直接下面这样写:
向后填充padEnd用法与此同理，有人会问，更简单的方法就是直接用+号将两个变量拼接就完事了。这两个填充方法有什么鸟用？其实，我也不知道，哈哈，既然有人提出这个，那他肯定是碰到了有这方面的需求，我们先知道有这两个填充方法就行了。
正则的u修饰符和y修饰符
ES6对正则表达式添加了u修饰符,用来正确处理大于\uFFFF的Unicode字符。
var s = “吉”;
console.log( /^./u test(s) ); // true
上面的代码表示,如果不添加u修饰符,正则表达式就会认为字符串s为两个字符,从而匹配失败。利用这一点,可以写出一个正确返回字符串长度的函数。
function codePointLength (text){
var result= text.match(/[\s\S]/gu);
return result ? result.length : 0;
}
var s=“吉吉”
console.log( s.length); //4
console.log( codePointLength(s) ); //2
除了u修饰符,ES6还为正则表达式添加了y修饰符,叫作“粘连”( sticky)修饰符。它的作用与g修饰符类似,也是全局匹配,后一次匹配都从上一次匹配成功的下一个位置开始。不同之处在于,g修饰符只确保剩余位置中存在匹配,而y修饰符则确保匹配必须从
剩余的第一个位置开始,这也就是“粘连”的涵义。
var s=“aaa_aa_a_j”;
var r1 =/a+/g;
var r2=/a+/y;
console.log(r1.exec(s)); //[“aaa”]
console.log(r2.exec(s)); //[“aaa”]
console.log(r1.exec(s)); //[“aa”]
console.log(r2.exec(s)); //null
上面的代码有两个正则表达式,一个使用g修饰符,另一个使用y修饰符。这两个正则表达式各执行了两次,第一次执行的时候,两者行为相同,剩余字符串都是“_aa_a”。由于g修饰符没有位置要求,所以第二次执行会返回结果,而y修饰符要求匹配必须从头部开始,所以返回null.如果改一下正则表达式,保证毎次都能头部匹配,y修饰符就会返回结果了。
var s =”aaa_aa_a”;
var r =/a+/y;
console.log(r.exec(s)); //["aaa"]
console.log(r.exec(s)); //[“aa_”]
上面的代码每次匹配,都是从剩余字符串的头部开始。进一步说,y修饰符隐含了头部匹配的标志。
/b/y.exec(“aba”)
//null
上面的代码由于不能保证头部匹配,所以返回 null。y修饰符的设计本意,就是让头部匹配的标志^在全局匹配中都有效
与y修饰符相匹配,ES6的正则对象多了 sticky属性,表示是否设置了y修饰符。
var r =/hello\d/y;
console.log(r.sticky); //true