js 截取最后一个/后的字符串|极客笔记

js 截取最后一个/后的字符串

在前端开发中，经常会遇到需要从一个URL或路径中获取文件名的情况，而文件名通常是由路径和文件名组成的。如果我们需要从一个包含路径的字符串中获取文件名，我们可以借助JavaScript中的字符串操作方法来实现。

方法一：使用split方法

JavaScript中的split方法可以根据指定的分隔符将一个字符串分割成多个子字符串，并返回一个包含分割后子字符串的数组。我们可以利用这一特性来获取路径中的文件名。

function getFileNameFromPath(path) {
    const parts = path.split('/');
    return parts[parts.length - 1];
}

const path = '/user/documents/files/file.txt';
const fileName = getFileNameFromPath(path);
console.log(fileName); // 输出：file.txt

在上面的代码中，我们先将路径根据/符号拆分成一个数组，然后取数组的最后一个元素作为文件名。

方法二：使用substring和lastIndexOf方法

除了使用split方法之外，我们还可以利用substring和lastIndexOf方法来截取路径中的文件名。

function getFileNameFromPath(path) {
    const index = path.lastIndexOf('/');
    return path.substring(index + 1);
}

const path = '/user/documents/files/file.txt';
const fileName = getFileNameFromPath(path);
console.log(fileName); // 输出：file.txt

在上面的代码中，我们通过lastIndexOf方法找到路径中最后一个/的位置，然后利用substring方法从该位置往后截取字符串，即为文件名。

方法三：使用正则表达式

如果需要更灵活地处理路径中的文件名，我们还可以使用正则表达式来匹配并提取文件名。下面是一个示例代码：

function getFileNameFromPath(path) {
    const pattern = /\/([^/]*)$/;
    const match = path.match(pattern);
    return match ? match[1] : '';
}

const path = '/user/documents/files/file.txt';
const fileName = getFileNameFromPath(path);
console.log(fileName); // 输出：file.txt

在上面的代码中，我们定义了一个正则表达式/\/([^/]*)$/，匹配最后一个/后面的任意字符，然后使用match方法提取出文件名。

总结

在本文中，我们介绍了三种不同的方法来从一个包含路径的字符串中获取文件名，分别是使用split方法、substring和lastIndexOf方法以及正则表达式。每种方法都有其适用的场景，开发者可以根据具体需求选择合适的方法来实现字符串的截取操作。在实际开发中，可以根据字符串的格式和要求来选择最合适的方法来处理路径中的文件名，以提高开发效率和代码的可维护性。