이미지 확장자 정규식

파일 업로드나 경로 처리에서 이미지 파일인지 판별해야 하는 경우가 많다. 간단한 정규식으로 주요 이미지 형식을 커버한다.

코드

const REGEX_IMG = /\.(png|webp|jpe?g|avif|gif)/;

function isImage(filename: string): boolean {
  return REGEX_IMG.test(filename);
}

사용 예

isImage("photo.jpg");     // true
isImage("image.jpeg");    // true (e?로 jpeg도 커버)
isImage("graphic.png");   // true
isImage("animation.gif"); // true
isImage("compressed.webp"); // true
isImage("modern.avif");   // true
isImage("document.pdf");  // false

패턴 설명

\.: 리터럴 점 매칭
(png|webp|jpe?g|avif|gif): 캡처 그룹으로 대안 표현
- jpe?g: jpg와 jpeg 모두 매칭 (e는 선택사항)

대소문자 처리

대문자 확장자도 처리하려면 i 플래그를 추가한다.

const REGEX_IMG = /\.(png|webp|jpe?g|avif|gif)/i;

isImage("PHOTO.JPG"); // true

대안 접근법

정규식 대신 MIME 타입으로 판별하려면:

async function isImageFile(file: File): Promise<boolean> {
  return file.type.startsWith("image/");
}

URL에서 확장자를 추출할 때는 URL API를 사용하는 것이 더 견고하다:

function getExtension(url: string): string {
  try {
    const pathname = new URL(url).pathname;
    return pathname.slice(pathname.lastIndexOf("."));
  } catch {
    return "";
  }
}

정규식은 간단하지만, URL에 쿼리 파라미터가 포함된 경우 등 오판정할 가능성이 있다. 용도에 따라 적절한 방법을 선택해야 한다.