How to remove spaces from a string using JavaScript ?
In this article, we will learn how to remove spaces from a string using Javascript. This can be done by the following methods:
- Using split() and join() Methods.
- Using replace() method with regex.
- Using reduce() method with the spread operator.
- Using the trim() method
Method 1: Using split() and join() Methods: The split() method is used to split a string into multiple sub-strings and return them in the form of an array. A separator can be specified as a parameter so that the string is split whenever that separator is found in the string. The space character (” “) is specified in this parameter to separate the string whenever a space occurs. The join() method is used to join an array of strings using a separator. This will return a new string with the joined string using the specified separator. This method is used on the returned array and no separator (“”) is used to join the strings. This will join the strings in the array and return a new string. This will remove all the spaces in the original string.
Syntax:
string.split(" ").join("")
Example: In this example, we will use the split() and join() Methods.
html
<!DOCTYPE html><html lang="en"><head> <title> How to remove spaces from a string using JavaScript ? </title></head><body> <h1 style="color: green"> GeeksforGeeks </h1> <b> How to remove spaces from a string using JavaScript? </b> <p> Original string is: Geeks for Geeks Portal </p> <p> New String is: <span class="output"></span> </p> <button onclick="removeSpaces()"> Remove Spaces </button> <script type="text/javascript"> function removeSpaces() { originalText = "Geeks for Geeks Portal"; removedSpacesText = originalText.split(" ").join(""); document.querySelector('.output').textContent = removedSpacesText; } </script></body></html> |
Output:
How to remove spaces from a string using JavaScript ?
Method 2: Using replace() method with regex: The replace() method is used to replace a specified string with another string. It takes two parameters, the first is the string to be replaced and the second parameter is the string replaced with. The second string can be given as an empty string so that the empty space to be replaced. The first parameter is given a regular expression with a space character (” “) along with the global property. This will select every occurrence of space in the string and it can then be removed by using an empty string in the second parameter. This will remove all the spaces in the original string.
Syntax:
string.replace(/ /g, "")
Example: In this example, we will use replace() method with regex.
html
<!DOCTYPE html><html lang="en"><head> <title> How to remove spaces from a string using JavaScript ? </title></head><body> <h1 style="color: green"> GeeksforGeeks </h1> <b> How to remove spaces from a string using JavaScript? </b> <p> Original string is: Geeks for Geeks Portal </p> <p> New String is: <span class="output"></span> </p> <button onclick="removeSpaces()"> Remove Spaces </button> <script> function removeSpaces() { originalText = "Geeks for Geeks Portal"; newText = originalText.replace(/ /g, ""); document.querySelector('.output').textContent = newText; } </script></body></html> |
Output:
How to remove spaces from a string using JavaScript ?
Method 3: Using reduce() method with spread operator: The spread operator is used to convert the string to an array and The reduce() method is used to reduce the array to a single value and executes a provided function for each value of the array and the return value of the function is stored in an accumulator and form a single value from the array. The function checks whether each character of the string is space or not if it is space doesn’t add a character to the accumulator and if it is not space then add a character to the accumulator. At the last accumulator return string doesn’t contains any space in it.
Syntax:
[...string].reduce((accum, char)=> (char===" ") ? accum : accum + char, '')
Example3: In this example, we will use reduce() method with spread operator
HTML
<!DOCTYPE html><html lang="en"><head> <title> How to remove spaces from a string using JavaScript ? </title></head><body> <h1 style="color: green"> GeeksforGeeks </h1> <b> How to remove spaces from a string using JavaScript? </b> <p> Original string is: Geeks for Geeks Portal </p> <p> New String is: <span class="output"></span> </p> <button onclick="removeSpaces()"> Remove Spaces </button> <script> function removeSpaces() { originalText = "Geeks for Geeks Portal"; removedSpacesText = [...originalText].reduce ((accum, char) => (char === " ") ? accum : accum + char, ''); document.querySelector('.output').textContent = removedSpacesText; } </script></body></html> |
Output:
How to remove spaces from a string using JavaScript ?
Method 4: Using the trim() method: This method removes all the whitespace from the start and end of the string. It returns the new string.
Syntax:
str.trim()
Example: In this example, we will remove the space from the start and end of the string using the trim() method.
Javascript
const geek = ' Geeksforgeeks ';console.log(geek);// Expected output: " Geeksforgeeks ";console.log(geek.trim());// Expected output: "Geeksforgeeks"; |
Output:
Geeksforgeeks Geeksforgeeks
Please Login to comment...