Question

我有一个完整的图像路径，我使用jquery来阅读，格式为$('img.my_image').attr('src')但是我只想要文件名部分（丢弃路径）。

是否有任何内置函数可以执行此操作，还是正则表达式是唯一的选项？

Answer 1

var Filename= path.split('/').pop()

Answer 2

var fileNameIndex = yourstring.lastIndexOf("/") + 1;
var filename = yourstring.substr(fileNameIndex);

Answer 3

function getFileName(path) {
return path.match(/[-_\w]+[.][\w]+$/i)[0];
}

Answer 4

我找到了一个处理unix和类似windows的路径字符串的更好版本。

数字1：

var unix_path = '/tmp/images/cat.jpg';
console.log(unix_path.replace(/^.*[\\\/]/, ''));

var win_path = 'c:\\temp\images\cat.jpg';
console.log(win_path.replace(/^.*[\\\/]/, ''));

输出将是 cat.jpg

2号:(可能更快）

var unix_path = '/tmp/images/cat.jpg';
console.log(unix_path.split(/[\\\/]/).pop());

var win_path = 'c:\\temp\images\cat.jpg';
console.log(win_path.split(/[\\\/]/).pop());

输出将是 cat.jpg

Answer 5

在Javascript中你可以做到

function getFileNameFromPath(path) {
  var ary = path.split("/");
  return ary[ary.length - 1];
}

Answer 6

使用此解决方案，您可以获得两个名称，即有和没有文件扩展名。


    //getting image source
    var path=$('img.my_image').attr('src');

    //splitting url and getting filename with file extension
    var file=path.split('/').pop();

    //removing extension and keeping just the filename
    var filename=file.split('.').shift();

Answer 7

对已接受答案的补充。看起来这里是最快的跨平台（Unix 和 Windows）解决方案：

function basePath(path) {
  return path.substr(
    Math.max(
      path.lastIndexOf('\\'),
      path.lastIndexOf('/'),
    ) + 1,
  );
}

这是必要的情况，当你有来自 Unix 和 Windows 的数据并且我们必须在一个地方解析。

这个函数只取所有可能的分隔符中最新的一个，并在最后一个分隔符之后返回字符串。大字符串的速度要快得多，这就是原因：

没有正则表达式，它们比简单的等式慢
没有规范化，没有无条件地扔掉整个字符串并从中创造新的东西
不创建任何新实例，例如新数组等，这需要一些时间和内存
没有额外的循环甚至查找，因为我们在这里不使用数组

在 Chromex87 中测试：

// Test subjects
//=====================
function basePathUnix(path) {
  return path.split('/').pop();
}

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

function basePathUnix3(path) {
  return path.substr(path.lastIndexOf('/') + 1);
}

function basePathCrossPlatform(path) {
  return path.replace(/^.*[\\\/]/, '');
}

function basePathCrossPlatform2(path) {
  return path.split(/[\\\/]/).pop();
}

function basePathCrossPlatform3(path) {
  return path.substr(Math.max(path.lastIndexOf('\\'), path.lastIndexOf('/')) + 1);
}

function basePathCrossPlatform4(path, separators = ['/', '\\']) {
  return path.substr(Math.max(...separators.map(s => path.lastIndexOf(s))) + 1);
}

// Tests
//=====================
function measureTime(name, fn) {
  const start = window.performance.now();
  for (let i = 0; i < 10000; i++) {
    fn();
  }
  const time = window.performance.now() - start;

  console.log(name, time);
}

function testResults(name, path) {
  console.log('\n[CHECK RESULTS]', name);

  console.log('basePathUnix:\t\t', basePathUnix(path));
  console.log('basePathUnix2:\t\t', basePathUnix2(path));
  console.log('basePathUnix3:\t\t', basePathUnix3(path));
  console.log('basePathCrossPlatform:\t', basePathCrossPlatform(path));
  console.log('basePathCrossPlatform2:\t', basePathCrossPlatform2(path));
  console.log('basePathCrossPlatform3:\t', basePathCrossPlatform3(path));
  console.log('basePathCrossPlatform4:\t', basePathCrossPlatform4(path));
}

function testPerformance(name, path) {
  console.log('\n[MEASURE PERFORMANCE]', name);

  measureTime('basePathUnix:\t\t', () => basePathUnix(path));
  measureTime('basePathUnix2:\t\t', () => basePathUnix2(path));
  measureTime('basePathUnix3:\t\t', () => basePathUnix3(path));
  measureTime('basePathCrossPlatform:\t', () => basePathCrossPlatform(path));
  measureTime('basePathCrossPlatform2:\t', () => basePathCrossPlatform2(path));
  measureTime('basePathCrossPlatform3:\t', () => basePathCrossPlatform3(path));
  measureTime('basePathCrossPlatform4:\t', () => basePathCrossPlatform4(path));
}

function runTest(name, path) {
  setTimeout(() => {
    testResults(name, path);

    setTimeout(() => {
      testPerformance(name, path);
    }, 200);
  }, 200);
}

// Run tests
//=====================
setTimeout(() => {
  const pathUnix = '/some/path/string/some/path/string/some/path/string/some/path/string/some/path/string/some/path/file-name';
  runTest('UNIX', pathUnix);
}, 1000);

setTimeout(() => {
  const pathWind = '\\some\\path\\string\\some\\path\\string\\some\\path\\string\\some\\path\\string\\some\\path\\file-name';
  runTest('WINDOWS', pathWind);
}, 2000);

使用Javascript从路径中获取文件名

7 个答案: