JavaScript截取字符串的Slice、Substring、Substr函数详解和比较

在JavaScript中，有3个常用的函数可以用来截取字符串。这些函数是Slice、Substring和Substr。这篇文章将详细介绍这些函数、它们的用法及它们之间的差异。

Slice函数

Slice函数用于从字符串中获取一段子字符串。它接受2个参数，开始位置和结束位置，其中开始位置包括在截取的字符串中，而结束位置不包括在截取的字符串中。如果没有给该函数传递第二个参数，则默认截取到字符串的结尾。

下面是一个示例代码：

const str = 'hello world';
const slicedStr = str.slice(0, 5); // "hello"

在这个示例中，截取的开始位置是0，结束位置是5。因此，返回的字符串是从字符串的开始到第5个字符的子字符串。

Substring函数

Substring函数与Slice函数相似，也用于截取字符串。但不同之处在于，它接受的第二个参数是截取的结束位置。如果没有传递第二个参数，则默认截取到字符串的结尾。

下面是一个示例代码：

const str = 'hello world';
const subStr = str.substring(0, 5); // "hello"

在这个示例中，截取的开始位置是0，结束位置是5。因此，返回的字符串是从字符串的开始到第5个字符的子字符串。

Substr函数

Substr函数也用于截取字符串，但它与Slice和Substring函数略有不同。它接受2个参数，开始位置和要截取的字符数。

下面是一个示例代码：

const str = 'hello world';
const substr = str.substr(0, 5); // "hello"

在这个示例中，截取的开始位置是0，要截取的字符数是5。因此，返回的字符串是从字符串的开始到第5个字符的子字符串。

比较这三个函数

这三个函数可以用来截取字符串，但由于它们的不同之处，它们之间也存在一些区别。

1. Slice和Substring函数的第二个参数是一样的，即截取的结束位置。但是Substr函数的第二个参数是截取的字符数。
2. Slice函数可以接受负数参数，表示从字符串的结尾开始计算截取位置。而Substring和Substr函数则不能接受负数参数。
3. 如果开始位置大于结束位置，Slice函数返回一个空字符串，Substring函数会自动交换开始位置和结束位置的值，而Substr函数返回从字符串结尾开始计算的子字符串。
4. 如果没有传递第一个参数(开始位置)，Slice函数和Substring函数默认从字符串的开始位置截取，而Substr函数默认从字符串结尾计算并截取。

下面是一些示例代码：

const str = 'hello world';

// Slice函数示例
console.log(str.slice(-5));  // "world"
console.log(str.slice(0, -6));  // "hello"

// Substring函数示例
console.log(str.substring(str.length - 5));  // "world"
console.log(str.substring(6, 0));  // "hello"

// Substr函数示例
console.log(str.substr(-5));  // "world"
console.log(str.substr(6, 5));  // "world"

这些示例代码展示了这三个函数的差异性及其用法。根据你的需求，选择适合你的函数来截取字符串吧！