【JavaScript中三个截取字符串函数用法和区别比较实例详解】在JavaScript中，处理字符串时经常需要用到截取字符串的功能。常见的三个字符串截取方法是 `substring()`、`substr()` 和 `slice()`。虽然它们都能实现字符串的截取功能，但使用方式和行为存在一些差异。以下是对这三者的详细讲解与对比。
一、说明
1. `substring(start, end)`
- 从 `start` 索引开始，到 `end` 索引（不包括）结束。
- 参数均为数字，且 `end` 可以小于 `start`，此时会自动交换位置。
- 不支持负数索引。
2. `substr(start, length)`
- 从 `start` 索引开始，截取 `length` 长度的字符。
- 支持负数索引，表示从末尾开始计算。
- 与 `substring()` 不同，参数顺序不同，且 `length` 是长度而非终点。
3. `slice(start, end)`
- 类似于 `substring()`，但从 `start` 到 `end`（不包括）。
- 支持负数索引，表示从字符串末尾倒数。
- 与 `substring()` 的主要区别在于对负数索引的处理。
二、三者对比表格
| 方法 | 参数类型 | 是否支持负数索引 | 是否包含 `end` 索引 | 是否可交换 `start` 和 `end` | 用途场景 |
| `substring()` | start, end | 否 | 否 | 是 | 截取从某点到某点的子串 |
| `substr()` | start, length | 是 | 否 | 否 | 从某点开始截取固定长度的子串 |
| `slice()` | start, end | 是 | 否 | 是 | 与 `substring()` 类似，更灵活 |
三、使用示例
```javascript
const str = "Hello, world!";
// substring 示例
console.log(str.substring(0, 5)); // 输出: "Hello"
// substr 示例
console.log(str.substr(7, 5)); // 输出: "world"
// slice 示例
console.log(str.slice(0, 5)); // 输出: "Hello"
console.log(str.slice(-6)); // 输出: "world!"
```
四、注意事项
- 在实际开发中，推荐使用 `slice()`，因为其语法更统一，兼容性更好，尤其在处理负数索引时更为直观。
- `substr()` 虽然功能强大，但在某些浏览器中可能被标记为“已弃用”，建议谨慎使用。
- `substring()` 和 `slice()` 行为非常相似，但 `slice()` 更适用于数组和字符串，具有更高的通用性。
五、总结
在JavaScript中，`substring()`、`substr()` 和 `slice()` 都可以用来截取字符串，但它们在参数设置、负数索引处理以及使用场景上各有特点。根据具体需求选择合适的函数，能够提升代码的可读性和健壮性。理解它们的区别，有助于在实际项目中避免错误并提高效率。
