Removing all non-alphabetic characters from a string in JavaScript

Non-alphabetic characters are any characters that are not part of the alphabet, and the strings are a data type that represents a sequence of characters or text. Working with strings is a basic task in JavaScript, and one common task is removing all non-alphabetic characters from a string. In this article, we will understand how to remove all non-alphabetic characters from a string.

Understanding the Problem

Suppose we have a string saying "he@656llo wor?ld". We want to remove all digits, punctuation, whitespace, and special characters from the given string. For example:

Input string we have:

"he@656llo wor?ld"

And the Output we want:

"helloworld"

Methods to Remove Non-Alphabetic Characters

We can remove the non-alphabetic characters from a string in the following ways:

• Using replace() with Regular Expression
• Using For Loop
• Using Array Methods with String Conversions

Using replace() with Regular Expression

Regular expressions are the most efficient way of removing non-alphabetic characters from a string with the replace() method. The replace() method searches for a specified pattern within a string and replaces it with a new substring.

Example

In the following example, we define a function called removeNonAlphabetic that uses regular expressions with the replace method. This function takes the string, replaces all non-alphabetic characters from it, and returns the cleaned string.

// defining function for removing non-alphabetic characters from string
function removeNonAlphabetic(str) {
    return str.replace(/[^A-Za-z]/g, '');
}

// Calling function and printing result in the console
console.log(removeNonAlphabetic("Hello, World! 123"));

HelloWorld

The regular expression /[^A-Za-z]/g matches any character that is NOT (^) a letter from A-Z or a-z. The 'g' flag ensures all matches are replaced globally.

Using For Loop

Using a for..of loop with character checking is another simple method of removing non-alphabetic characters from a string. The string match() method searches for a pattern in the string and returns matches.

Example

In this example, we use a for-of loop and the string match() method to check each character individually and build a result string containing only alphabetic characters.

// defining function for removing non-alphabetic characters from string
function removeNonAlphabetic(str) {
    let result = '';
    for (let char of str) {
        if (char.match(/[a-zA-Z]/)) {
            result += char;
        }
    }
    return result;
}

// Calling function and printing result in the console
console.log(removeNonAlphabetic("Hello, World! 123"));

HelloWorld

Using Array Methods with String Conversions

Using array methods such as the filter() method and the join() method while converting a string into an array using the string split() method is another efficient approach.

The filter() method returns a new array of elements that pass the specified conditions, and the join() method converts the array elements back into a string.

Example

In this example, we define a function called removeNonAlphabetic that converts the string into an array using split(), filters out non-alphabetic characters, and reconstructs the string using join().

// defining function for removing non-alphabetic characters from string
function removeNonAlphabetic(str) {
    return str.split('').filter(char => /[A-Za-z]/.test(char)).join('');
}

// Calling function and printing result in the console
console.log(removeNonAlphabetic("Hello, World! 123"));

HelloWorld

Comparison of Methods

Conclusion

The replace() method with regular expressions is the most efficient approach for removing non-alphabetic characters. Choose the for..of loop for better readability or array methods for functional programming style.