How to Extract a File Extension from a Filename in JavaScript

By the end of this page, you will understand how to extract a file extension from a filename in JavaScript, when simple string methods are enough, when to use Node.js path utilities, and how to handle tricky cases like filenames without extensions or files that begin with a dot.

A file extension is the part of a filename that appears after the last dot. It is often used to indicate file type:

• photo.jpg → jpg
• report.pdf → pdf
• script.js → js

In programming, extracting the extension is useful for:

• validating uploads
• choosing how to process a file
• filtering file lists
• displaying file type icons

In JavaScript, there is no single universal string method called something like getExtension(). Instead, developers usually solve this in one of two ways:

1. Use string methods such as lastIndexOf() and slice()
2. Use Node.js built-in utilities such as path.extname() when working with file paths on the server

The important part is not just getting text after a dot, but handling edge cases correctly. For example:

• README has no extension
• .gitignore starts with a dot, but is usually treated as a hidden filename, not a file with extension gitignore
• archive.tar.gz may be treated as gz if you want only the final extension

So the real concept is: an extension is usually determined by the last dot in the base filename, but context matters.

Think of a filename like a label on a storage box.

• The main name is the box label: photo
• The extension is the small tag at the end: .jpg

If you want the extension, you usually look for the last dot in the label.

Examples:

• photo.jpg → look after the last dot → jpg
• archive.tar.gz → look after the last dot → gz
• README → no dot at the end part → no extension
• .gitignore → the dot is at the start, so this is usually a hidden filename, not a normal extension

So the mental rule is:

Find the last meaningful dot. If there is none, there is probably no extension.

A common JavaScript approach uses lastIndexOf().

function getExtension(filename) {
  const lastDot = filename.lastIndexOf('.');

  if (lastDot <= 0) {
    return '';
  }

  return filename.slice(lastDot + 1);
}

console.log(getExtension('photo.jpg'));      // jpg
console.log(getExtension('archive.tar.gz')); // gz
console.log(getExtension('README'));         // ""
console.log(getExtension('.gitignore'));     // ""

How it works

• lastIndexOf('.') finds the last dot in the string
• If the dot is missing, it returns -1
• If the dot is at position 0, the filename starts with a dot, like .gitignore
• slice(lastDot + 1) returns everything after the dot

If you want the dot included

function getExtensionWithDot(filename) {
  const lastDot = filename.lastIndexOf('.');

  if (lastDot <= 0) {
    return '';
  }

  return filename.slice(lastDot);
}

console.log(getExtensionWithDot('photo.jpg')); // .jpg

Node.js option: path.extname()

If you are working in Node.js with file paths, you can use the built-in path module:

const path = require('path');

console.log(path.extname('photo.jpg'));      // .jpg
console.log(path.extname('archive.tar.gz')); // .gz
console.log(path.extname('README'));         // ""
console.log(path.extname('.gitignore'));     // ""

This is often the best choice in backend code because it is built for path handling.

Let's trace this example:

function getExtension(filename) {
  const lastDot = filename.lastIndexOf('.');

  if (lastDot <= 0) {
    return '';
  }

  return filename.slice(lastDot + 1);
}

console.log(getExtension('report.final.pdf'));

Step-by-step

1. filename is 'report.final.pdf'
2. filename.lastIndexOf('.') finds the last dot
3. The last dot is before 'pdf'
4. lastDot becomes the index of that dot
5. if (lastDot <= 0) is checked
   • it is not <= 0, so the function continues
6. filename.slice(lastDot + 1) returns the part after the dot
7. The result is 'pdf'
8. console.log() prints pdf

Another trace: no extension

console.log(getExtension('README'));

1. lastIndexOf('.') returns -1
2. -1 <= 0 is true
3. The function returns ''

Another trace: hidden file

console.log(getExtension('.env'));

1. The dot is at index 0
2. 0 <= 0 is true
3. The function returns ''

This prevents .env from being treated as extension env.

Here are common situations where extracting file extensions is useful:

• File upload validation
  • Allow only .jpg, .png, or .pdf
• Choosing a parser
  • Read .json files with a JSON parser
  • Read .csv files with a CSV parser
• Displaying icons in a file manager
  • Show a PDF icon for .pdf
  • Show an image icon for .png
• Filtering files in scripts
  • Process only .log files in a directory
• Export features
  • Decide whether to save output as .txt, .csv, or .json

Example:

function isImageFile(filename) {
  const ext = getExtension(filename).toLowerCase();
  return ['jpg', 'jpeg', 'png', 'gif', 'webp'].includes(ext);
}

console.log(isImageFile('avatar.PNG')); // true

In real projects, developers usually do more than just extract an extension.

1. Normalize case

Extensions may come in uppercase or mixed case.

const ext = getExtension(filename).toLowerCase();

2. Use guard clauses

Return early for invalid input.

function getExtension(filename) {
  if (typeof filename !== 'string' || filename.length === 0) {
    return '';
  }

  const lastDot = filename.lastIndexOf('.');
  if (lastDot <= 0) {
    return '';
  }

  return filename.slice(lastDot + 1);
}

3. Validate against an allowlist

const allowedExtensions = ['jpg', 'png', 'pdf'];
const ext = getExtension(filename).toLowerCase();

if (!allowedExtensions.includes(ext)) {
  throw new Error('Unsupported file type');
}

4. Prefer path utilities on the server

In Node.js codebases, path.extname() is common because filenames often come from full paths.

const path = require('path');

function isJsonFile(filePath) {
  return path.extname(filePath).toLowerCase() === '.json';
}

5. Do not rely on extension alone for security

Real systems often combine extension checks with:

• MIME type validation
• file signature checks
• server-side parsing

This is important because a file can be renamed to have a misleading extension.

1. Using the first dot instead of the last dot

Broken example:

function getExtension(filename) {
  const firstDot = filename.indexOf('.');
  return filename.slice(firstDot + 1);
}

console.log(getExtension('archive.tar.gz')); // tar.gz

If you want only the final extension, use lastIndexOf() instead.

2. Treating hidden files as having an extension

Broken example:

function getExtension(filename) {
  const lastDot = filename.lastIndexOf('.');
  return filename.slice(lastDot + 1);
}

console.log(getExtension('.gitignore')); // gitignore

This is usually not what you want. Check lastDot <= 0.

3. Forgetting files with no extension

Broken example:

console.log(getExtension('README'));

If your function does not handle -1, it may return the whole string or an incorrect result.

4. Ignoring case differences

console.log(getExtension('PHOTO.JPG')); // JPG

If you compare directly with 'jpg', you may get false mismatches. Use:

getExtension(filename).toLowerCase()

5. Checking extension on a full path without proper handling

If you are in Node.js and working with paths like /files/photo.jpg, path.extname() is clearer and safer than custom string logic.

6. Assuming extension means true file type

A file named virus.jpg is not guaranteed to be a real image. Extensions are useful, but not reliable for security.

lastIndexOf() vs indexOf()

Return with dot vs without dot

// Without dot
function getExtension(filename) {
  const lastDot = filename.lastIndexOf('.');
  if (lastDot <= 0) return '';
  return filename.slice(lastDot + 1);
}

// With dot
function getExtensionWithDot(filename) {
  const lastDot = filename.lastIndexOf('.');
  if (lastDot <= 0) return '';
  return filename.slice(lastDot);
}

Rules

• Use lastIndexOf('.') for the final extension
• If the result is -1, there is no dot
• If the result is 0, it is usually a hidden file like .env
• Use .toLowerCase() before comparing extensions
• In Node.js, prefer path.extname() for file paths

Examples

• photo.jpg → jpg
• archive.tar.gz → gz
• README → ''
• .gitignore → ''

Node.js

const path = require('path');
path.extname('photo.jpg'); // '.jpg'

Is there a built-in JavaScript function to get a file extension?

Not in core string methods. In plain JavaScript, you usually use lastIndexOf() and slice(). In Node.js, you can use path.extname().

How do I get the extension without the dot?

Use slice(lastDot + 1) after finding the last dot.

What happens if the filename has no extension?

A good function should return an empty string, such as ''.

Is .gitignore considered to have the extension gitignore?

Usually no. It is normally treated as a hidden filename that starts with a dot.

How do I handle filenames like archive.tar.gz?

Most extension logic returns only the final extension, gz. If you need tar.gz, that is a custom rule.

Should I use file extension checks for security?

No. Extensions are useful for convenience, but not enough for security. Validate MIME type or file contents too.

Does path.extname() work in the browser?

Not by default. It is a Node.js API. In browser code, use string methods unless your tooling provides a path module.

• String methods — Useful because extension extraction often uses lastIndexOf() and slice().
• Node.js path module — Related because path.extname() is the built-in server-side solution.
• File paths vs filenames — Important because a full path may need different handling than a simple filename.
• Input validation — Related because extracted extensions are often used to validate uploads.
• Array includes() — Helpful when checking whether an extension is in an allowlist.
• Case normalization — Important when comparing values like JPG and jpg.
• MIME types — Related because file extensions do not always reflect the real file type.