JavaScript Program to Remove Non-Alphanumeric Characters from a String

In this article, we will see how to remove non-alphanumeric characters from a string in JavaScript. Non-alphanumeric characters are symbols, punctuation, and whitespace. Removing them from a string This task can be useful when you want to clean up user inputs, sanitize strings, or perform various text processing operations.

There are multiple approaches to removing non-alphanumeric characters from a string in JavaScript.

We will explore all the above methods along with their basic implementation with the help of examples.

Approach 1: Using Regular Expressions

Regular expressions offer a concise way to match and remove non-alphanumeric characters. We can use the replace() method with a regular expression to replace all non-alphanumeric characters with an empty string.

Syntax:

function removeNonAlphanumeric(inputString) {
    return inputString.replace(/[^a-zA-Z0-9]/g, '');
};

Example: In this example we are using the above-explained approach.

Javascript

function removeFunction(inputString) {
    return inputString.replace(/[^a-zA-Z0-9]/g, '');
}

const originalString =
    "Hello! This is 123 a test string.";
const result =
    removeFunction(originalString);
console.log(result);

Output

HelloThisis123ateststring

Approach 2: Using a Loop and Character Checking

By iterating through each character in the string and checking if it’s alphanumeric, we can construct the resulting string without non-alphanumeric characters.

Syntax:

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

Example: In this example we are using the above-explained approach.

Javascript

function removeFunction(inputString) {
    let result = '';
    for (let i = 0; i < inputString.length; i++) {
        const char = inputString[i];
        if (/[a-zA-Z0-9]/.test(char)) {
            result += char;
        }
    }
    return result;
}

const originalString =
    "Hello! This is 123 a test string.";
const result =
    removeFunction(originalString);
console.log(result);

Output

HelloThisis123ateststring

Approach 3: Using the replace() Method with a Custom Function

The replace() method can be used with a custom function that checks each character and replaces non-alphanumeric characters.

Syntax:

function removeNonAlphanumeric(inputString) {
    return inputString.replace(/./g, char => {
        if (/[a-zA-Z0-9]/.test(char)) {
            return char;
        }
        return '';
    });
}

Example: In this example we are using the above-explained approach.

Javascript

function romveFunction(inputString) {
    return inputString.replace(/./g, char => {
        if (/[a-zA-Z0-9]/.test(char)) {
            return char;
        }
        return '';
    });
}

const originalString =
    "Hello! This is 123 a test string.";
const result =
    romveFunction(originalString);
console.log(result);

Output

HelloThisis123ateststring