如何更有效的获取文件扩展名

2016-4-25 11:30 1910 0

摘要: 问：如何获取文件扩展名？var file1 = "50.xsl"; var file2 = "30.doc"; getFileExtension(file1); //xsl getFileExtension(file2); //doc function getFileExtension(filename) { /*TODO*/ }方案一：正则表 ...

问：如何获取文件扩展名？

var file1 = "50.xsl";
var file2 = "30.doc";
getFileExtension(file1); //xsl
getFileExtension(file2); //doc

function getFileExtension(filename) {
  /*TODO*/
}

方案一：正则表达式

function getFileExtension1(filename) {
    return (/[.]/.exec(filename)) ? /[^.]+$/.exec(filename)[0] : undefined;
}

方案二：使用 `String` 的 `split` 方法

function getFileExtension2(filename) {
    return filename.split('.').pop();
}

上述两种方案无法覆盖一些极端情况，下面这个更健壮

方案三：使用 `String` 的 `slice` ， `lastIndexOf` 方法

function getFileExtension3(filename) {
    return filename.slice((filename.lastIndexOf('.') - 1 >>> 0) + 2);
}

console.log(getFileExtension3(''));                            // ''
console.log(getFileExtension3('filename'));                    // ''
console.log(getFileExtension3('filename.txt'));                // 'txt'   
console.log(getFileExtension3('.hiddenfile'));                 // ''
console.log(getFileExtension3('filename.with.many.dots.ext')); // 'ext'

这货怎么工作的？

String.lastIndexOf 返回指定值的最后出现位置(本例里是： . )。如果返回 -1 ，表示没找到该指定值
当参数是 filename ， .hiddenfile 时， lastIndexOf 的返回值分别是 -1和 0 。然后无符号移位操作符将 -2 转成了 4294967294 、 -1 转成了4294967295 ，这个小技巧保证了极端状况下文件名也不会变
然后 String.prototype.slice 就以上面的计算结果作为起始下标从原始字符串中提取出了正确的文件扩展名。如果上一步骤计算出的起始下标大于原始字符串长度，则返回 ''

比较

方案	参数	结果
正则表达式	”	undefined
	‘filename’	undefined
	‘filename.txt’	‘txt’
	‘.hiddenfile’	‘hiddenfile’
	‘filename.with.many.dots.ext’	‘ext’
`String` 的 `split`	”	”
	‘filename’	‘filename’
	‘filename.txt’	‘txt’
	‘.hiddenfile’	‘hiddenfile’
	‘filename.with.many.dots.ext’	‘ext’
`String` 的 `slice` 和 `lastIndexOf`	”	”
	‘filename’	”
	‘filename.txt’	‘txt’
	‘.hiddenfile’	”
	‘filename.with.many.dots.ext’	‘ext’