Question: How to get the file extension?
var file1 = '50.xsl';
var file2 = '30.doc';
getFileExtension(file1); //returs xsl
getFileExtension(file2); //returs doc
function getFileExtension(filename) {
/*TODO*/
}
Solution 1: Regular Expression
function getFileExtension1(filename) {
return /[.]/.exec(filename) ? /[^.]+$/.exec(filename)[0] : undefined;
}
Solution 2: String split method
function getFileExtension2(filename) {
return filename.split('.').pop();
}
Those two solutions couldnot handle some edge cases, here is another more robust solution.
Solution3: String slice, lastIndexOf methods
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'
How does it works?
- String.lastIndexOf() method returns the last occurrence of the specified value (
'.'in this case). Returns-1if the value is not found. - The return values of
lastIndexOffor parameter'filename'and'.hiddenfile'are-1and0respectively. Zero-fill right shift operator (>>>) will transform-1to4294967295and-2to4294967294, here is one trick to insure the filename unchanged in those edge cases. - String.prototype.slice() extracts file extension from the index that was calculated above. If the index is more than the length of the filename, the result is
"".
Comparison
| Solution | Paramters | Results |
|---|---|---|
| Solution 1: Regular Expression | '' 'filename' 'filename.txt' '.hiddenfile' 'filename.with.many.dots.ext' | undefined undefined 'txt' 'hiddenfile' 'ext' |
Solution 2: String split | '' 'filename' 'filename.txt' '.hiddenfile' 'filename.with.many.dots.ext' | '' 'filename' 'txt' 'hiddenfile' 'ext' |
Solution 3: String slice, lastIndexOf | '' 'filename' 'filename.txt' '.hiddenfile' 'filename.with.many.dots.ext' | '' '' 'txt' '' 'ext' |
Live Demo and Performance
Here is the live demo of the above codes.
Here is the performance test of those 3 solutions.
