Get the Part after Last Occurrence in a String in JavaScript

avatar
Borislav Hadzhiev

Last updated: Mar 1, 2024
3 min

banner

# Get the Part after the Last Occurrence in a String in JavaScript

To get the part after the last occurrence of a character in a string:

  1. Use the String.lastIndexOf() method to get the index of the lash occurrence in the string.
  2. Use the String.slice() method to get the part after the last occurrence in the string.
index.js
const str = '/hello/world/index.html'; const afterLastSlash = str.slice(str.lastIndexOf('/') + 1); console.log(afterLastSlash); // ๐Ÿ‘‰๏ธ index.html

get part after last occurrence in string

The code for this article is available on GitHub

The String.slice() method extracts a section of a string and returns it, without modifying the original string.

The String.slice() method takes the following arguments:

NameDescription
start indexThe index of the first character to include in the returned substring
end indexThe index of the first character to exclude from the returned substring

When only a single argument is passed to the String.slice() method, the slice goes to the end of the string.

index.js
const str = 'bobbyhadz.com'; console.log(str.slice(5)); // ๐Ÿ‘‰๏ธ hadz.com console.log(str.slice(10)); // ๐Ÿ‘‰๏ธ com

We used the String.lastIndexOf() method to get the index of the last slash / character in the string.

index.js
const str = '/hello/world/index.html'; console.log(str.lastIndexOf('/')); // ๐Ÿ‘‰๏ธ 12 console.log(str.lastIndexOf('/') + 1); // ๐Ÿ‘‰๏ธ 13

We don't want to include the last occurrence of the character in the string, so we added 1 to the index.

# Handling the scenario where the character isn't found

Note that the lastIndexOf() method returns -1 if it doesn't find the character in the string.

If you are OK with returning the entire string if the character doesn't exist in the string, then you don't have to do anything.

If you need to return an empty string if the character isn't found, use an if statement.

index.js
const str = '/hello/world/index.html'; let result = ''; const char = '@'; if (str.lastIndexOf(char) !== -1) { result = str.slice(str.lastIndexOf(char) + 1); } console.dir(result); // ๐Ÿ‘‰๏ธ ""

handling the scenario where the character is not found

The code for this article is available on GitHub

We initialized the result variable to an empty string.

If the lastIndexOf() method didn't return -1, then the character is contained in the string and we reassign the variable to the result.

# Creating a reusable function

If you have to do this often define a reusable function.

index.js
function afterLastOccurrence(string, char) { return string.slice(string.lastIndexOf(char) + 1); } // ๐Ÿ‘‡๏ธ index.html console.log(afterLastOccurrence('/hello/world/index.html', '/')); // ๐Ÿ‘‡๏ธ com console.log(afterLastOccurrence('bobby,hadz,com', ',')); // ๐Ÿ‘‡๏ธ com console.log(afterLastOccurrence('bobby_hadz_com', '_'));

creating a reusable function

An alternative and perhaps a simpler approach is to use the split and pop methods.

# Get the Part after the Last Occurrence in a String using split()

This is a two-step process:

  1. Use the String.split() method to split the string on each occurrence of the character.
  2. Use the String.pop() method to get the part of the string after the last occurrence.
index.js
const str = 'hello/world/index.html'; const afterLastSlash = str.split('/').pop(); console.log(afterLastSlash); // ๐Ÿ‘‰๏ธ index.html

get part after last occurrence in string using split

The code for this article is available on GitHub

The code sample returns the substring after the last slash in the string.

We used the String.split() method to split the string on a forward slash / character.

This returns an array of strings without the slash / separator.

index.js
const str = 'hello/world/index.html'; const splitOnSlash = str.split('/'); console.log(splitOnSlash); // ๐Ÿ‘‰๏ธ ['hello', 'world', 'index.html']

We called the Array.pop() method to remove and return the last element from the array.

index.js
const str = 'hello/world/index.html'; const afterLastSlash = str.split('/').pop(); console.log(afterLastSlash); // ๐Ÿ‘‰๏ธ index.html

If you care about performance you would use the 1st approach, even though the difference is negligible unless you work with very large strings.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.
book cover
You can use the search field on my Home Page to filter through all of my articles.

Copyright ยฉ 2024 Borislav Hadzhiev