JavaScript Remove non-Alphanumeric Characters


Working with strings in JavaScript often requires manipulating or cleaning up the data. The non-alphanumeric characters including symbols, punctuation marks, and whitespaces in a string make it difficult to read and understand. More specifically, removing non-alphanumeric characters from a string/text is a common task in JavaScript.

This post will describe the methods to remove non-alphanumeric characters from a string in JavaScript.

How to Remove Non-Alphanumeric Characters in JavaScript?

For removing non-alphanumeric characters from a string in JavaScript, utilize the given JavaScript prebuilt methods:

  • replace() method
  • for loop

Method 1: Remove Non-Alphanumeric Characters in JavaScript Using “replace()” Method

To remove non-alphanumeric characters, utilize the “replace()” method with regular expressions or regexes. It provides a powerful way to remove non-alphanumeric characters from a text or string. The replace() method searches for a specified pattern in a text and replaces it with a new value.

Syntax

Use the given syntax for the replace() method to replace the non-alphanumeric characters from a string:

replace("searchedValue", "newValue")

Example
In the given example, first, we will create a variable “string” that stores “JavaScript” containing non-alphanumeric characters including “%@!*:

const string = "%Java@Scri!pt*";

To remove these non-alphanumeric characters, we will use the regex pattern in the “replace()” method that will replace these characters with the empty string:

const str = string.replace(/[^a-zA-Z0-9]/g, "");

Finally, print the resultant string on the console using the “console.log()” method:

console.log(str);

As you can see in the output, all the non-alphanumeric characters have been successfully removed from the specified word:

Example 2

Here, we will remove all non-alphanumeric characters except white spaces from a string. First, store a string in a variable “string”:

const string = "%JavaScript! is used for creating #dynamic websites $";

Call the replace() method that will replace the non-alphanumeric characters with the white spaces and store the resultant string in the variable “str”:

const str = string.replace(/[^a-zA-Z0-9]/g, " ");

Lastly, we will print the value of the “str” on the console:

console.log(str);

Output

Method 2: Remove Non-Alphanumeric Characters in JavaScript Using “for” Loop

Another way to remove the non-alphanumeric characters from a string is using the “for” loop method. It is the commonly used approach in JavaScript. It will iterate over the string and use the regex pattern with the “test()” method to find the non-alphanumeric characters and remove them.

Example

Create a variable “str” that stores an empty string. This variable will hold the resulting string after removing non-alphanumeric characters:

let str = "";

Use the “for” loop to iterate the string until its length and check the alphanumeric character from a string using the regex pattern and the test() method. If the character matches the regular expression or regex pattern, append it to the variable “str”:

for (let i = 0; i < string.length; i++) { 
const char = string[i]; 
if (/[a-zA-Z0-9]/.test(char)) { 
str += char; 
} 
}

Now, we will display the resultant string on the console:

console.log(str);

The given output removes all the non-alphanumeric characters including all special characters and white spaces from the specified string:

That’s all about removing non-alphanumeric characters from a string in JavaScript.

Conclusion

To remove non-alphanumeric characters from a string in JavaScript, use the “replace()” method or the “for” loop approach with the regex pattern and the “test()” method. This post will describe the methods to remove non-alphanumeric characters from a text in JavaScript.

 

Print Friendly, PDF & Email
Categories