Skip to content
Related Articles

Related Articles

How to remove a character from string in JavaScript ?
  • Last Updated : 11 Jul, 2019

Given a string and the task is to remove a character from the given string.

Method 1: Using replace() method: The replace method is used to replace a specific character/string with other character/string. It takes two parameters, first is the string to be replaced and the second is the string which is to be replaced with. In this case, the first parameter is the character which is to be removed and the second parameter can be given as an empty string. This will remove the character from the string. This method removes the first occurrence of the string.

Syntax:

string.replace('characterToReplace', '');

Example:




<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to remove a character from 
        string using Javascript?
    </title>
</head>
  
<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
      
    <b>
        How to remove a character from
        a string using Javascript?
    </b>
      
    <p>Original string is GeeksforGeeks</p>
      
    <p>
        New String is: 
        <span class="output"></span>
    </p>
  
    <button onclick="removeCharacter()">
        Remove Character
    </button>
      
    <script type="text/javascript">
        function removeCharacter() {
            originalString = 'GeeksForGeeks';
            newString = originalString.replace('G', '');
  
            document.querySelector('.output').textContent 
                    = newString;
        }
    </script>
</body>
  
</html>                    

Output:



  • Before clicking the button:
    replace-before
  • After clicking the button:
    replace-after

Method 2: Using replace() method with a regular expression: This method is used to remove all occurrences of the specified character, unlike the previous method. A regular expression is used instead of the string along with the global property. It will select every occurrence in the string and it can be removed.

Syntax:

string.replace(/regExp/g, '');

Example:




<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to remove a character from 
        string using Javascript?
    </title>
</head>
  
<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
      
    <b>
        How to remove a character from
        a string using Javascript?
    </b>
      
    <p>Original string is GeeksforGeeks</p>
      
    <p>
        New String is: 
        <span class="output"></span>
    </p>
  
    <button onclick="removeCharacter()">
        Remove Character
    </button>
      
    <script type="text/javascript">
        function removeCharacter() {
            originalString = 'GeeksForGeeks';
            newString = originalString.replace(/G/g, '');
  
            document.querySelector('.output').textContent
                    = newString;
        }
    </script>
</body>
  
</html>                    

Output:

  • Before clicking the button:
    replaceAll-before
  • After clicking the button:
    replaceAll-after

Method 3: Removing the first or last character using slice() method: The slice() method is used to extract parts of a string between the given parameters. This method takes the starting index and the ending index of the string and returns the string in between these indices. If the ending index is not specified, it is assumed to be the length of the string. The first character could be removed by specifying the beginning index to be 1. It extracts the string from the second character up to the end of the string. The last character could be removed by specifying the ending index to be one less than the length of the string. This extracts the string from the beginning of the string to the second to last character.

Syntax:

// Removing the first character
string.splice(1);

// Removing the last character
string.splice(0, string.length - 1);

Example:




<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to remove a character from 
        string using Javascript?
    </title>
</head>
  
<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
      
    <b>
        How to remove a character from
        a string using Javascript?
    </b>
      
    <p>Original string is GeeksforGeeks</p>
      
    <p>
        First character removed string: 
        <span class="output1"></span>
    </p>
      
    <p>
        Last character removed string: 
        <span class="output2"></span>
    </p>
  
    <button onclick="removeCharacter()">
        Remove Character
    </button>
      
    <script type="text/javascript">
        function removeCharacter() {
            originalString = 'GeeksForGeeks';
            firstCharRemoved = originalString.slice(1);
              
            lastCharRemoved = 
                originalString.slice(0, originalString.length - 1);
  
            document.querySelector('.output1').textContent
                    = firstCharRemoved;
            document.querySelector('.output2').textContent
                    = lastCharRemoved;
        }
    </script>
</body>
  
</html>                    

Output:

  • Before clicking the button:
    firstLastChar-before
  • After clicking the button:
    firstLastChar-after

Method 4: Removing a particular character at given index using substr() method: This method can be used to remove a character from a particular index in the string. The substr() method is used to extract parts of a string between the given parameters. This method takes two parameters, one is the starting index and the other is the ending index of the string. The string between these indices is returned. The portion of the string before and after the character to be removed is separated and joined together. This removes the character from the specific index.

Syntax:

string.slice(0, position - 1) + string.slice(position, string.length);

Example:




<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to remove a character from 
        string using Javascript?
    </title>
</head>
  
<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
      
    <b>
        How to remove a character from
        a string using Javascript?
    </b>
      
    <p>Original string is GeeksforGeeks</p>
      
    <p>
        New String is: 
        <span class="output"></span>
    </p>
  
    <!-- Removing the 6th character -->
    <button onclick="removeCharacter(6)">
        Remove Character
    </button>
      
    <script type="text/javascript">
        function removeCharacter(position) {
            originalString = 'GeeksForGeeks';
              
            newString = originalString.slice(0, position - 1)
            + originalString.slice(position, originalString.length);
  
            document.querySelector('.output').textContent = newString;
        }
    </script>
</body>
  
</html>                    

Output:

  • Before clicking the button:
    atIndex-before
  • After clicking the button:
    atIndex-after
My Personal Notes arrow_drop_up
Recommended Articles
Page :