「这是我参与11月更文挑战的第 1 天，活动详情查看：2021最后一次更文挑战」

ES6之字符串的扩展

一、判断是否包含方法

1.includes()方法

includes() 方法用于判断一个字符串是否包含在另一个字符串中，返回布尔值。

 str.includes(searchString[,position])

• searchString：在 str 字符串中搜索的字符串。
• position ： 可选项。从当前字符串的哪个索引位置开始搜寻子字符串，默认值为0。

includes() 方法区分大小写 。

2.startsWith()方法

startsWith()方法用于判断当前字符串是否是以另外一个给定的子字符串“开头”的，返回布尔值。

 str.startsWit(searchString[,position])

• searchString：在 str 字符串中搜索的字符串。
• position ： 可选项。从当前字符串的哪个索引位置开始搜寻子字符串，默认值为0。

startsWith() 方法区分大小写 。

 // ES6提供的startsWith()方法
 console.log(str.startsWith('qi'));//true
 console.log(str.startsWith('qi',2))//false
 ​
 // startsWith()方法是区分大小写的
 console.log(str.startsWith('QI'));//false

3.endsWith()方法

endsWith()方法用于判断当前字符串是否是以另外一个给定的子字符串“结尾”的，返回布尔值。

 x 1str.endsWith(searchString[,position])

• searchString：在 str 字符串中搜索的字符串。
• position ： 可选项。从当前字符串的哪个索引位置开始搜寻子字符串，默认值为0。

endsWith() 方法区分大小写 。

 // ES6提供的endsWith()方法
 console.log(str.endsWith('g'));//true
 console.log(str.endsWith('wang',9))//true
 ​
 // endsWith()方法是区分大小写的
 console.log(str.endsWith('G'));//false

---

二、重复字符串

1.repeat()方法

repeat()方法用于将原字符串重复n次，返回一个新字符串。

 str.repeat(number)

• number：表示将原字符串复的次数。

number参数具有以下几种情况：

• 如果number参数为小数的话，则会向下取整。
• 如果number 参数为负数或者无穷大的话，则会报错。
• 如果number 参数为 NaN 的话，则为0，不输出任何值。
• 如果number参数为字符串，则会先转换为数字值。

示例代码如下：

 let str = '123';
 str.repeat(3);
 console.log(str.repeat(3));//123123123
 //可知repeat方法仅仅返回一个新的字符串（不会改变原有字符串的内容）
 console.log(str,str.repeat(3))//123 123123123
 ​
 // 1. number为小数，向下取整
 console.log(str.repeat(2.5));//123123
 ​
 // 2.number为NaN，不报错
 console.log(str.repeat(NaN));//没有任何输出
 ​
 // 3.number为负数或无穷大，报错
 // console.log(str.repeat(-2));//RangeError: Invalid count value
 ​
 // 4.number为零，没有任何输出
 console.log(str.repeat(0));
 ​
 // 5.number 为字符串或布尔值，先转换成数字值
 console.log(str.repeat('3'));//123123123
 console.log(str.repeat(true));//123

---

三、模板字符串

模板字符串是增强版的字符串，使用反引号（``）来代替普通字符串中的用双引号和单引号。它可以当做普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量。

示例代码如下：

 // 1. 替换原有的普通字符串
 // 定义一个普通字符串
 let str1 = 'nihao';
 // 定义一个模板字符串 -- 充当普通字符串来使用
 let str2 = 'nihao';
 console.log(str1,str2);//nihao nihao
 ​
 // 2. 多行字符串
 // 定义一个普通字符串
 let str3 = 'ni\nhao';
 // 定义一个模板字符串
 let str4 = `
 ni
 hao`;
 console.log(str3,str4);
 ​
 // 3. 字符串与变量配合使用
 let name = '迪迦';
 // 普通字符串
 console.log('hello '+name+'!');//hello 迪迦!
 // 模板字符串
 console.log(`hello ${name}!`);//hello 迪迦!

1.带标签的模板字符串

模板字符串的功能可以紧跟在一个函数名后面，该函数将被调用来处理这个模板字符串。这被称为“标签模板”功能( Tagged Tenplate ) 。

示例代码如下：

 let str = 'qijiawang';
 // 普通字符串
 console.log('this is '+ str + '.');//this is qijiawang.
 // 模板字符串
 console.log(`this is ${str}.`);//this is qijiawang.
 // 带标签的模板字符串
 console.log`this is ${str}.`;//[ 'this is ', '.' ] qijiawang

标签模板其实不是模板，而是函数调用的一种特殊形式。“标签”指的就是函数，紧跟在后面的模板字符串就是它的参数。

---

2.原始字符串

在标签函数的第一个参数中，存在一个特殊的属性raw ，可以通过它来访问模板字符串的原始字符串,而不经过特殊字符的替换。

另外，使用 String.raw()方法创建原始字符串和使用默认模板函数和字符串连接创建是一样的。

示例代码如下：

 /*
     原始字符串 - 应用在带标签的模板字符串
     * 在函数的第一个参数中，存在着raw属性 -> 获取到模板字符串的原始字符串
     * 所谓的原始字符串
       * 模板字符串被定义时的内容，而不是被处理之后的内容
         * 被定义时的内容 - this is ${str}.
         * 被处理之后的内容 - this is function》
 */
 ​
 let str = 'function';
 function fn(arg){
     console.log(arg.raw);//[ 'this is ', '.' ]
 }
 fn`this is ${str}.`;
 ​
 console.log(String.raw`this is ${str}`);//this is function

\