js获取后缀名

背景

Code Review 的时候看到小伙伴提交了一段用于提取文件拓展名的代码：

// 截取图片后缀信息
// example: 'www.baidu.com/somepic.jpg?h/w/'
// return: '.jpg'
const getExtension = (url = '') => {
  const end = url.indexOf('?') || undefined;
  const start = url.lastIndexOf('.', end);
  return url.substring(start, end);
};

这种写法固然没错，那么是否有别的写法嘞?

方案一

const getExtension = (url = '') => {
  const extensionName = url.split('.').pop()
  return extensionName ? `.${extensionName}` : ''
}

方案二

正则表达式

const getExtension = (url = '') => {
  const matches = url.match(/.*(\.[^?]+)/)
  return matches ? matches[1] : ''
}

可能有些同学对正则不太熟悉，以下对这个正则做一下解释：

1. .*： . 表示非换行符号， * 用于消耗尽可能多的字符
2. () 括号表示捕获组，这里 () 中的表达式就是用于捕获后缀名。
3. \. 表示 . 的转义
4. [^\?+]: ^ 表示非， + 表示一个或者多个。因此 [^?+] 即表示非 ？的多个字符

Node

如果是在 node 的环境，本地的文件名可以通过 path 模块提供的 extname 获取：

const { extname } = require('path')

console.log(extname('some-pic.jpg'))
// .jpg

那如果是远程地址呢？可以通过 url 模块得到 pathname 之后再用 extname 来获取：

const { extname } = require('path')
const { parse } = require('url');

const getExtension = (url = '') => extname(parse(url).pathname)