How to Remove a Trailing Slash from a String in JavaScript

avatar

Borislav Hadzhiev

Tue Oct 26 20213 min read

Remove a Trailing Slash from a String #

To remove a trailing slash from a string, call the replace method with the following regular expression /\/+$/ as the first parameter and an empty string as the second. The replace method will strip the trailing slash and return a copy of the string.

index.js
function removeTrailingSlash(str) { return str.replace(/\/+$/, ''); } // ๐Ÿ‘‡๏ธ "example.com" console.log(removeTrailingSlash('example.com/')); // ๐Ÿ‘‡๏ธ "example.com" console.log(removeTrailingSlash('example.com///')); // ๐Ÿ‘‡๏ธ "example.com" console.log(removeTrailingSlash('example.com'));
If you're looking to avoid regular expressions, scroll down to the next code snippet.

We used the String.replace method to get a new string that doesn't contain any trailing slashes.

We passed the following 2 parameters to the replace method:

  1. A regular expression we want to match in the string.
  2. A replacement string for each match. Because we want to remove the trailing slash, we provided an empty string as the replacement.

The forward slashes / / mark the beginning and end of the regular expression.

We had to escape the forward slash with a backslash, because it is a special character.

The plus + matches the preceding item (the forward slash) 1 or more times.

And the dollar $ sign matches the end of the input.

In its entirety the regular expression matches one or more trailing slashes at the end of the string.

If you ever need help reading a regular expression, check out this regex cheatsheet from MDN. It's by far the best one out there.

The replace method does not change the original string, it returns a new string with one or more matches replaced. Strings are immutable in JavaScript.

An alternative approach is to use the String.endsWith method.

To remove a trailing slash from a string:

  1. Call the endsWith() method on the string and check if it ends with a slash.
  2. If it ends with a slash, use the slice method to remove the last character from the string.
  3. If it doesn't end with a slash, return the string as is.
index.js
function removeTrailingSlash(str) { return str.endsWith('/') ? str.slice(0, -1) : str; } // ๐Ÿ‘‡๏ธ "example.com" console.log(removeTrailingSlash('example.com/')); // ๐Ÿ‘‡๏ธ "example.com" console.log(removeTrailingSlash('example.com'));

We used the String.endsWith method to check if the string ends with a slash character.

The method returns true if the string ends with the supplied character and false otherwise.

We used a ternary operator, which is very similar to an if / else statement.

If the string ends with a slash, we call the String.slice method and return the entire string up to the last character.

We passed the following parameters to the slice method:

  1. start index - the index of the first character to be included in the new string.
  2. end index - extract characters up to, but not including this index. A negative index of -1 means go up to, but not including the last character of the string
Indexes are zero-based in JavaScript, meaning the index of the first character in the string is 0 and the last - string.length - 1.
Passing an end index parameter of -1 and str.length - 1 is the same. We instruct the slice method to go up to, but not including the last character in the string.

If the string doesn't end with a slash, we simply return the string.

Note that this approach doesn't handle the scenario where the string ends with multiple slashes. We only remove the last character using the slice method.

Further Reading #

Join my newsletter

I'll send you 1 email a week with links to all of the articles I've written that week

Buy Me A Coffee