Javascript regex for matching/extracting file extension

Question

The following regex

var patt1=/[0-9a-z]+$/i;

extracts the file extension of strings such as

filename-jpg
filename#gif
fil         


        

Answer 1

Just add a . to the regex

var patt1=/\.[0-9a-z]+$/i;

Because the dot is a special character in regex you need to escape it to match it literally: \..

Your pattern will now match any string that ends with a dot followed by at least one character from [0-9a-z].

Example:

[
  "foobar.a",
  "foobar.txt",
  "foobar.foobar1234"
].forEach( t => 
  console.log(
    t.match(/\.[0-9a-z]+$/i)[0]
  ) 
)

---

if you want to limit the extension to a certain amount of characters also, than you need to replace the +

var patt1=/\.[0-9a-z]{1,5}$/i;

would allow at least 1 and at most 5 characters after the dot.

Answer 2

ONELINER:

let ext = (filename.match(/\.([^.]*?)(?=\?|#|$)/) || [])[1] 

above solution include links. It takes everything between last dot and first "?" or "#" char or string end. To ignore "?" and "#" characters use /\.([^.]*)$/. To ignore only "#" use /\.([^.]*?)(?=\?|$)/. Examples

function getExtension(filename) {
  return (filename.match(/\.([^.]*?)(?=\?|#|$)/) || [])[1];
}


// TEST
[
  "abcd.Ef1",
  "abcd.efg",
  "abcd.efg?aaa&a?a=b#cb",
  "abcd.efg#aaa__aa?bb",
  "abcd",
  "abcdefg?aaa&aa=bb",
  "abcdefg#aaa__bb",
].forEach(t=> console.log(`${t.padEnd(21,' ')} -> ${getExtension(t)}`))

Answer 3

Try

var patt1 = /\.([0-9a-z]+)(?:[\?#]|$)/i;

This RegExp is useful for extracting file extensions from URLs - even ones that have ?foo=1 query strings and #hash endings.

It will also provide you with the extension as $1.

var m1 = ("filename-jpg").match(patt1);
alert(m1);  // null

var m2 = ("filename#gif").match(patt1);
alert(m2);  // null

var m3 = ("filename.png").match(patt1);
alert(m3);  // [".png", "png"]

var m4 = ("filename.txt?foo=1").match(patt1);
alert(m4);  // [".txt?", "txt"]

var m5 = ("filename.html#hash").match(patt1);
alert(m5);  // [".html#", "html"]

P.S. +1 for @stema who offers pretty good advice on some of the RegExp syntax basics involved.

Answer 4

Example list:

var fileExtensionPattern = /\.([0-9a-z]+)(?=[?#])|(\.)(?:[\w]+)$/gmi
//regex flags -- Global, Multiline, Insensitive

var ma1 = 'css/global.css?v=1.2'.match(fileExtensionPattern)[0];
console.log(ma1);
// returns .css

var ma2 = 'index.html?a=param'.match(fileExtensionPattern)[0];
console.log(ma2);
// returns .html

var ma3 = 'default.aspx?'.match(fileExtensionPattern)[0];
console.log(ma3);
// returns .aspx

var ma4 = 'pages.jsp#firstTab'.match(fileExtensionPattern)[0];
console.log(ma4);
// returns .jsp

var ma5 = 'jquery.min.js'.match(fileExtensionPattern)[0];
console.log(ma5);
// returns .js

var ma6 = 'file.123'.match(fileExtensionPattern)[0];
console.log(ma6);
// returns .123

Test page.