用于匹配/提取文件扩展名的Javascript正则表达式

Javascript regex for matching/extracting file extension

本文关键字:扩展名 Javascript 正则表达式 文件 提取 用于      更新时间:2023-09-26

以下正则表达式

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

提取字符串(如(的文件扩展名

filename-jpg
filename#gif
filename.png

当字符串真的是一个以一个点作为分隔符的文件名时,如何修改这个正则表达式以只返回扩展名?(显然filename#gif不是常规文件名(

UPDATE根据tvanofsson的评论,我想澄清的是,当JS函数接收到字符串时,字符串将已经包含一个没有空格、没有句点和其他特殊字符的文件名(它实际上将被处理为slug(。问题不在于解析文件名,而在于错误地解析slugs——当函数被赋予"filename jpg"时,它返回了"jpg"的扩展名,而实际上它应该返回null或空字符串,正是这种行为需要纠正

只需在正则表达式中添加一个.

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

因为点是正则表达式中的一个特殊字符,所以您需要对其进行转义以匹配它:'.

现在,您的模式将匹配任何以句点结尾、后跟[0-9a-z]中至少一个字符的字符串。

示例:

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


如果您还想将扩展名限制为一定数量的字符,则需要替换+

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

将允许在点之后至少有1个且最多有5个字符。

尝试

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

此RegExp可用于从URL中提取文件扩展名,即使是具有?foo=1查询字符串和#hash结尾的URL也是如此。

它还将为您提供扩展名$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,他就所涉及的一些RegExp语法基础提供了非常好的建议。

示例列表:

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

测试页面。

ONELINER:

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

上述解决方案包括链接。它占用最后一个点和第一个"点"之间的所有内容;CCD_ 10";或";CCD_ 11";字符或字符串结尾。忽略";CCD_ 12";以及";CCD_ 13";字符使用CCD_ 14。只忽略";CCD_ 15";使用CCD_ 16。示例

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)}`))

我在O’Reilly正则表达式食谱上找到了这个解决方案(第8章,第24节(。它不区分大小写,可与.NET、Java、JavaScript、PCRE、Perl、Python&红宝石

'.[^.''/:*?"<>|'r'n]+$

文件扩展名必须以句点开头。因此,我们添加了›。›以匹配正则表达式开头的文字点。

文件名(如2.0.txt版本(可能包含多个点。最后一个点是将扩展名与文件名分隔开的点。扩展名本身不应包含任何点。我们在正则表达式中通过在字符类中放置一个点来指定这一点。点只是字符类中的一个字面字符,所以我们不需要对其进行转义。正则表达式末尾的Ş$›锚点确保我们匹配.txt而不是.0。

如果字符串以反斜杠结尾,或者以不包含任何句点的文件名结尾,则regex将完全不匹配。当它匹配时,它将匹配扩展名,包括分隔扩展名的点和。。。

我建议使用此函数,因为它可以避免返回空

const getExtension = (filename?: string): string | undefined => {
  if (!filename) return undefined
  const match = /'.([^.]+)$/.exec(filename)
  return match ? match[1] : undefined
}

此函数采用一个可选的文件名参数,该参数可以是未定义的。如果文件名未定义,函数将返回undefined。否则,函数将使用正则表达式从文件名中提取文件扩展名。如果正则表达式匹配,函数将返回提取的文件扩展名;否则,返回undefined。

const getExtension = (filename) => {
  if (!filename) return undefined
  const match = /'.([^.]+)$/.exec(filename)
  return match ? match[1] : undefined
}
[
  "a.abc.x.ico",
  "foobar.a",
  "foobar.txt",
  "foobar.foobar1234",
  "undegined",
  undefined, null
].forEach(t =>
  console.log(
    getExtension(t)
  )
)