模板字符串

+ 连接符

在 ES6 之前，将字符串连接到一起的旧方法是使用字符串连接运算符 (+)。

const student = {
  name: 'Richard Kalehoff',
  Guardian: 'Mr. Kalehoff'
};

const teacher = {
  name: 'Mrs. Wilson',
  room: 'N231'
}

let message = student.name + ' please see ' + teacher.name + ' in ' + teacher.room + ' to pick up your report card.';
//Returns:Richard Kalehoff please see Mrs. Wilson in N231 to pick up your report card.

上述代码能正常运行，但是当你需要连接多行字符串时，就变得更复杂。

let note = teacher.name + ',nn' +
  'Please excuse ' + student.name + '.n' +
  'He is recovering From the flu.nn' +
  'Thank you,n' +
  student.guardian;

但是，在引入模板字面量（之前在 ES6 的开发版本中称为“模板字符串”）之后，这一切有了改变。

注意: 作为字符串连接运算符 ( + ) 的替代方法，你可以使用字符串的 concat() 方法。但是这两种方式都比较笨拙，无法模拟真正的字符串插值。

模板字面量

模板字面量本质上是包含嵌入式表达式的字符串字面量。

模板字面量用反引号表示，可以包含用 ${exPression} 表示的占位符。这样更容易构建字符串。

下面是之前的示例使用模板字面量表示后的效果：

let message = `${student.name} please see ${teacher.name} in ${teacher.room} to pick up your report card.`;

通过使用模板字面量，你不用再使用引号和字符串连接运算符。此外，你可以在表达式内引用对象的属性。

...那之前的多行示例该怎么办呢？

let note = `${teacher.name},
 
  Please excuse ${student.name}.
  He is recovering from the flu.
  
  Thank you
  ${student.guardian}`;

这是模板字面量的真正强大之处。在上述代码中，去掉了引号和字符串连接运算符，以及换行符 ( n )。这是因为模板字面量也将换行符当做字符串的一部分！

提示：模板字面量中的嵌入式表达式不仅仅可以用来引用变量。你可以在嵌入式表达式中进行运算、调用函数和使用循环！

includes(), startsWITh(), endsWith()

传统上，JavaScript 只有indexOf方法，可以用来确定一个字符串是否包含在另一个字符串中。ES6 又提供了三种新方法。

• includes()：返回布尔值，表示是否找到了参数字符串。
• startsWith()：返回布尔值，表示参数字符串是否在原字符串的头部。
• endsWith()：返回布尔值，表示参数字符串是否在原字符串的尾部。

let s = 'Hello world!';

s.startsWith('Hello') // true
s.endsWith('!') // true
s.includes('o') // true

这三个方法都支持第二个参数，表示开始搜索的位置。

let s = 'Hello world!';

s.startsWith('world', 6) // true
s.endsWith('Hello', 5) // true
s.includes('Hello', 6) // false

上面代码表示，使用第二个参数n时，endsWith的行为与其他两个方法有所不同。它针对前n个字符，而其他两个方法针对从第n个位置直到字符串结束。