JavaScript模板字符串如何简写

# JavaScript模板字符串如何简写

在ES6中，模板字符串（Template Literals）通过反引号（`` ` ``）和`${}`插值语法极大简化了字符串拼接。以下是几种常见简写技巧：

## 1. 单行字符串拼接
传统方式需用`+`连接变量，模板字符串直接嵌入变量：
```javascript
const name = 'Alice';
// 传统写法
const str1 = 'Hello, ' + name + '!'; 
// 简写
const str2 = `Hello, ${name}!`;

2. 多行字符串

无需手动添加\n换行符：

// 传统写法
const text1 = 'Line1\nLine2';
// 简写
const text2 = `Line1
Line2`;

3. 表达式运算

${}内可直接进行运算或调用函数：

const a = 5, b = 10;
console.log(`Sum: ${a + b}`); // "Sum: 15"

4. 标签模板（高级用法）

通过自定义函数处理模板字符串：

function highlight(strings, ...values) {
  // 处理逻辑
}
const result = highlight`Price: ${price}`;

模板字符串的简写不仅提升代码可读性，还减少了拼接错误的风险。 “`