Skip to main content

How to Remove Everything After a Specific Character in JavaScript

A common text manipulation task is to truncate a string, keeping only the portion that comes before a specific character or delimiter. For example, you might want to get the username from an email address (everything before the @) or extract a base URL before a ?.

This guide will teach you the modern, standard methods for this task. You will learn how to use slice() with indexOf() to remove everything after the first occurrence of a character, and lastIndexOf() to remove everything after the last occurrence.

The Core Problem: First vs. Last Occurrence​

Before you start, you must decide which instance of the character you want to split on.

  • First Occurrence: In a string like report-2023-final.pdf, finding the first - is the goal.
  • Last Occurrence: In a file path like C:\Users\Admin\Documents\report.pdf, finding the last . is the goal.

JavaScript has different methods for each of these scenarios.

Removing Everything After the First Occurrence of a Character​

The most direct and readable way to do this is to find the index of the first occurrence of your character and then "slice" the string up to that point.

Logic:

  1. Use String.prototype.indexOf() to get the zero-based index of the first time the character appears.
  2. Use String.prototype.slice() to extract the part of the string from the beginning up to that index.

Problem: you want to get the username from an email address.

// Problem: Get the part of the string before the '@'.
let email = 'user@example.com';

Solution:

let email = 'user@example.com';
let separator = '@';

let index = email.indexOf(separator);

// slice() extracts from the start index up to (but not including) the end index.
let username = email.slice(0, index);

console.log(username);

Output:

user
note

This is the recommended best practice for its clarity and performance.

Removing Everything After the Last Occurrence of a Character​

The logic is nearly identical, but instead of indexOf(), you use String.prototype.lastIndexOf() to find the starting point for your slice. This is perfect for tasks like removing a file extension.

Problem: you want to get the filename without its extension.

// Problem: Get the part of the string before the last '.'.
let filename = 'project.report.final.pdf';

Solution:

let filename = 'project.report.final.pdf';
let separator = '.';

let index = filename.lastIndexOf(separator);

let baseName = filename.slice(0, index);

console.log(baseName);

Output:

project.report.final

Handling the "Character Not Found" Edge Case​

A critical part of writing robust code is handling the case where the character doesn't exist in the string. Both indexOf() and lastIndexOf() will return -1 if the substring is not found.

Problem: if index is -1, slice(0, -1) will unexpectedly remove the last character of the string.

let str = 'filename'; // No dot
let index = str.lastIndexOf('.'); // -1

// This is a bug! It returns "filenam" instead of the full string.
let result = str.slice(0, index); 
console.log(result);

Output: (Incorrect!)

filenam

Solution: always add a guard clause to check if the index is not -1 before you slice.

function removeAfterChar(str, char) {
  let index = str.indexOf(char);
  
  // If the character is not found, return the original string.
  if (index === -1) {
    return str;
  }
  
  // Otherwise, slice the string up to the character.
  return str.slice(0, index);
}

// Example Usage:
console.log(removeAfterChar('user@example.com', '@')); // Output: 'user'
console.log(removeAfterChar('username', '@'));         // Output: 'username'

Output:

user
username

An Alternative Method: Using split()​

A very common and concise alternative is to use the String.prototype.split() method. This method splits the string into an array of substrings using the specified character as a delimiter.

Solution: To get the part of the string before the first occurrence, you simply take the first element of the resulting array.

let email = 'user@example.com';
let separator = '@';

let username = email.split(separator)[0];

console.log(username);

Output:

user
note

This method has the advantage of handling the "not found" case gracefully by default. If the separator is not in the string, split() returns an array containing just the original string, so taking the first element still gives the correct result.

Conclusion​

Removing everything after a character is a simple task with several idiomatic solutions in JavaScript.

  • To remove everything after the first occurrence, the recommended method is str.slice(0, str.indexOf(char)), but you must handle the case where the character is not found. The str.split(char)[0] method is a more concise and often safer alternative.
  • To remove everything after the last occurrence, the standard and best practice is str.slice(0, str.lastIndexOf(char)).

Table of Contents