在 JavaScript 中，字符串是一种基本类型，广泛应用于文本处理和数据处理中。然而，在实际开发中，我们经常需要从字符串中截取出特定的子串，以便进一步处理或展示给用户。因此，学会用 JavaScript 截取字符串的基础方法非常重要。

1. substr 方法

substr 是 JavaScript 中最简单、最基础的截取字符串方法之一。它的形式为：

```

str.substr(start[, length])

```

其中，start 是从哪个字符开始截取，length 是要截取的字符数。如果省略 length，则截取到字符串结尾。

示例：

```javascript

let str = 'Hello, world!'

console.log(str.substr(0, 5)) // 'Hello'

console.log(str.substr(7)) // 'world!'

```

2. slice 方法

slice 方法也可以用于截取字符串，但它与 substr 有所不同。slice 的形式为：

```

str.slice(start[, end])

```

其中，start 是从哪个字符开始截取，end 是截止位置，但不包括 end 这个字符。如果省略 end，则截取到字符串结尾。

示例：

```javascript

let str = 'Hello, world!'

console.log(str.slice(0, 5)) // 'Hello'

console.log(str.slice(7)) // 'world!'

```

与 substr 不同的是，slice 还支持负数参数。当 start 或 end 是负数时，表示从字符串末尾开始截取。例如：

```javascript

let str = 'Hello, world!'

console.log(str.slice(-6)) // 'world!'

```

3. substring 方法

substring 方法也是一种截取字符串的方法，但它与 substr 和 slice 略有区别。substring 的形式为：

```

str.substring(start, end)

```

其中，start 是从哪个字符开始截取，end 是截止位置，但不包括 end 这个字符。如果省略 end，则截取到字符串结尾。

示例：

```javascript

let str = 'Hello, world!'

console.log(str.substring(0, 5)) // 'Hello'

console.log(str.substring(7)) // 'world!'

```

与 slice 不同的是，substring 不支持负数参数，如果传入负数参数会被当作 0 处理。另外，如果 start 大于 end，则 substring 会自动交换两个参数的位置。例如：

```javascript

let str = 'Hello, world!'

console.log(str.substring(6, 0)) // 'Hello'

console.log(str.substring(0, 6)) // 'Hello,'

```

4. split 方法

split 方法是将一个字符串分割成多个子串，并将结果存储在数组中。它的形式为：

```

str.split([separator[, limit]])

```

其中，separator 是分隔符，可以是字符串或正则表达式。limit 是指定分割出的子串数量的上限。如果省略 limit，则分割出所有子串。

示例：

```javascript

let str = 'a,b,c,d,e'

console.log(str.split(',')) // ['a', 'b', 'c', 'd', 'e']

console.log(str.split(',', 3)) // ['a', 'b', 'c']

```

需要注意的是，如果分隔符是一个空字符串，则会将字符串中的每个字符都分割出来。例如：

```javascript

let str = 'Hello'

console.log(str.split('')) // ['H', 'e', 'l', 'l', 'o']

```

5. substring 和 slice 和 substr 比较

在上面的三种截取字符串的方法中，substring、slice 和 substr 在使用上有一些区别。下面列举几点：

- substring 和 slice 用法类似，但 substring 不支持负数参数，且会自动交换两个参数的位置。slice 支持负数参数，且不会交换参数位置。

- substr 与另外两种方法有所不同。它的第二个参数表示要截取的字符数，而不是截止位置。如果省略第二个参数，则一直截取到字符串结尾。

- 当传入的参数不合法时，三种方法的处理方式也有所不同。substring 和 slice 会将 NaN、Infinity、-Infinity 视为 0，substr 会将 NaN 视为 0，将 Infinity、-Infinity 视为字符串长度。

综上所述，我们可以根据实际需求选择合适的方法来截取字符串。

6. 其他字符串处理方法

在 JavaScript 中，还有很多其他的字符串处理方法，可以帮助我们更轻松地完成字符串操作。例如：

- indexOf 和 lastIndexOf：分别用于查找字符串中某个子串的位置，indexOf 从前向后查找，lastIndexOf 从后向前查找。

```javascript

let str = 'Hello, world!'

console.log(str.indexOf('o')) // 4

console.log(str.lastIndexOf('o')) // 8

```

- replace：用于将字符串中的某个子串替换为另一个子串。

```javascript

let str = 'Hello, world!'

console.log(str.replace('Hello', 'Hi')) // 'Hi, world!'

```

- toLowerCase 和 toUpperCase：分别用于将字符串中的所有字符转为小写或大写。

```javascript

let str = 'Hello, world!'

console.log(str.toLowerCase()) // 'hello, world!'

console.log(str.toUpperCase()) // 'HELLO, WORLD!'

```

- trim：用于去除字符串两端的空格。

```javascript

let str = ' Hello, world! '

console.log(str.trim()) // 'Hello, world!'

```

以上这些方法可以加快我们的开发效率，提高代码的可读性和可维护性。

总结

本文介绍了 JavaScript 中截取字符串的基础方法，分别是 substr、slice 和 substring。另外还介绍了一些其他的字符串处理方法，这些方法可以帮助我们更轻松地完成字符串操作。掌握这些方法对于我们在实际开发中的工作至关重要，希望本文能对大家有所帮助。