How to retrieve the extension, filename from a filepath with javascript and php

Retrieve the filename with extension

Javascript

To retrieve the filename, we will split by the slash caracter /. To achieve this in Javascript, we will use the following Regular Expression /^.*[\\\/]/: 

// Any filepath, even inverted slash
// var filepath = "\\myfilepath\\extensions\\filename.png";
var filepath = "/myfilepath/extensions/filename.png";

// Use the regular expression to replace the non-matching content with a blank space
var filenameWithExtension = filepath.replace(/^.*[\\\/]/, '');

// outputs filename.png
console.log(filenameWithExtension);

The regular expression will return the remaining text from the last / (slash character). As not any file can contain / in his name but \ too, this function will work for all the cases.

In case that you don't want to use a regular expression because you're sure that the provided filepaths only use a defined type of slash (either / or \ ), you can split the string by the specified character and then obtain the last item:

var filepath = "/myfilepath/extensions/filename.png";

// With a normal slash
var group = filepath.split("/");
// or a path with an inverted slash
// var group = filepath.split("\\");

// Use the regular expression to replace the non-matching content with a blank space
var filenameWithExtension = group.pop();
// Or if you can't use pop()
// var filenameWithExtension = group[group.length - 1];

// outputs filename.png
console.log(filenameWithExtension);

PHP

With PHP we will use the basename function which is available in all php versions :

$filepath = "/myfilepath/extensions/filename.jpg";
$filename = basename($filepath); // filename.jpg

$filepath = "/myfilepath/extensions/filename.jpg";
$filename = preg_replace('/^.+[\\\\\\/]/', '', $filepath);  // filename.jpg

Retrieve the file extension

Javascript

To retrieve the extension from a path (or filename, it doesn't matter in this case) with Javascript we will split the string by . character and we will retrieve the last item of the obtained array.

var path = "path/a-long/path/to-my/file.jpg";
var path_splitted = path.split('.');
var extension = path_splitted.pop();

// Here the file will not have extension !
if(extension === path){
  // The filepath doesn't have . characters, that means doesn't have extension. for example :
  // if you try with : path/to/my/file/thisisafile
  // extension == path/to/my/file/thisisafile
}

// show extension
console.log(extension);

PHP

To retrieve the extension from a path with php we will use pathinfo function.

$path = "this-is-my/long/filepath/to/file.txt";
$ext = pathinfo($path, PATHINFO_EXTENSION);// PATHINFO_EXTENSION is a constant
echo $ext; // output txt

$path = "this-is-another-long-path/to/my/file.txt";
$array_ofpath = explode('.', $path);//explode returns an array
$extension = end($array);