在 JavaScript 中，我们有多种方法可以截取字符串的片段。其中一种是使用 substr() 函数。它可以从指定的字符串中获取子字符串，并把它们返回。

substr() 函数接收两个参数：截取开始位置和截取长度。下面是该函数的语法：

```javascript

string.substr(start, length)

```

其中，start 表示截取开始位置的索引，表示从哪个字符开始截取。length 表示截取的长度，表示需要截取多少个字符。如果不传入 length 参数，那么从开始位置一直截取到字符串的末尾。

下面是一些示例：

```javascript

var str = "hello world";

var result = str.substr(0, 5); // 截取开始位置为 0，长度为 5 的子字符串

console.log(result); // 输出 "hello"

var result2 = str.substr(6); // 截取开始位置为 6，一直截取到字符串末尾

console.log(result2); // 输出 "world"

```

需要注意的是，如果 start 参数为负数，那么它表示从后往前数的索引。例如，-1 表示列表中的最后一个字符，-2 表示倒数第二个字符，以此类推。

下面是一些示例：

```javascript

var str = "hello world";

var result = str.substr(-5); // 从字符串末尾开始，截取长度为 5 的子字符串

console.log(result); // 输出 "world"

var result2 = str.substr(-8, 3); // 从字符串的倒数第八个字符开始，截取长度为 3 的子字符串

console.log(result2); // 输出 "wor"

```

substr() 函数非常实用，可以在许多情况下使用。例如，它可以用于从 URL 中提取文件名或路径名，并且可以用于验证输入字段中的电话号码或身份证号码。

下面是一个示例函数，该函数使用 substr() 函数从 URL 中提取文件名：

```javascript

function getFileName(url) {

var start = url.lastIndexOf("/") + 1;

var end = url.lastIndexOf(".");

return url.substr(start, end - start);

}

var url = "http://example.com/path/to/file.jpg";

var fileName = getFileName(url);

console.log(fileName); // 输出 "file"

```

在上面的代码中，getFileName() 函数接收一个 URL 参数。它先通过 lastIndexOf() 函数找到路径中的最后一个斜杠字符的位置，然后加上 1，作为截取开始位置。接下来，它再通过 lastIndexOf() 函数找到文件扩展名的位置，作为截取结束位置。

最后，调用 substr() 函数并传入开始位置和长度参数来获取文件名。这个函数不仅可以获取文件名，还可以获取任何类型的字符串中的文本片段。

使用 substr() 函数来截取字符串的片段非常简单，这种方法可以用于许多不同的场景。不管是用于提取文本，还是用于验证输入，都非常实用。熟练掌握 substr() 函数可以让你的代码更加优雅简洁，同时提高代码的可读性和维护性。