JavaScript | padEnd() Method

The padEnd() method in JavaScript is used to pad a string with another string until it reaches the given length. The padding is applied from the right end of the string.

Syntax:

string.padEnd( targetLength, padString )

Parameters: This method accepts two parameters as mentioned above and described below:



  • targetLength: It is the length of the final string once the original string has been padded. If the value is less than the original string length, then the original string is returned.
  • padString: It is the string that is to be padded with the original string. If this value is too long to be within the targetLength, it is truncated.

Return Value: It returns the final string that is padded with the given string of the given length.

Example 1: This example uses padEnd() method to pad strings into another string.

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>
        JavaScript | padEnd() method
    </title>
</head>
  
<body>
    <h1 style="color: green">
        GeeksforGeeks
    </h1>
      
    <b>
        JavaScript | padEnd() method
    </b>
      
    <p>
        Output for "Hello" with "$": 
        <span class="output"></span>
    </p>
      
    <p>
        Output for "Geeks" with "Geeks": 
        <span class="output2"></span>
    </p>
      
    <button onclick="padStrings()">
        Pad Strings
    </button>
      
    <script type="text/javascript">
          
        function padStrings() {
            exString = "Hello";
            exString2 = "Geeks";
          
            output = 
                exString.padEnd(12, "$");
            output2 = 
                exString2.padEnd(12, "Geeks");
          
            document.querySelector('.output').textContent
                    = output;
              
            document.querySelector('.output2').textContent
                    = output2;
        }
    </script>
</body>
  
</html>

chevron_right






                        filter_none








Output:


    

  • Before clicking the button:
    
strings-before
    • 

  • After clicking the button:
    
strings-after
    • 



Example 2: This example uses padEnd() method to pad numbers into the another number.











                                    filter_none




                                    edit

                                    close




                                    play_arrow




                                    link

                                    brightness_4

                                    code
                                




















<!DOCTYPE html> 


<html> 


  


<head> 


    <title> 


        JavaScript | padEnd() method 


    </title> 


</head> 


  


<body> 


    <h1 style="color: green"> 


        GeeksforGeeks 


    </h1> 


      


    <b> 


        JavaScript | padEnd() method 


    </b> 


      


    <p> 


        Output for "1234" with "0":  


        <span class="output"></span> 


    </p> 


      


    <p> 


        Output for "99" with "**":  


        <span class="output2"></span> 


    </p> 


      


    <button onclick="padNumbers()"> 


        Pad Numbers 


    </button> 


      


    <script type="text/javascript"> 


        function padNumbers() { 


            exNumber = 1234; 


            exNumber2 = 99; 


          


            output =  


                String(exNumber).padEnd(8, "0"); 


                  


            output2 =  


                String(exNumber2).padEnd(8, "**"); 


                  


          


            document.querySelector('.output').textContent 


                    = output; 


              


            document.querySelector('.output2').textContent 


                    = output2; 


        } 


    </script> 


</body> 


  


</html> 



















                        chevron_right







                        filter_none








Output:


    

  • Before clicking the button:
    
numbers-before
    • 

  • After clicking the button:
    
numbers-after
    • 



Supported Browsers: The browser supported by padEnd() method are listed below:


    

  • Google Chrome 57
    • 

  • Firefox 48
    • 

  • Edge 15
    • 

  • Safari 10
    • 

  • Opera 44
    • 



full-stack-img





    

        My Personal Notes
        arrow_drop_up
    

    

        
        

            
            
        

    


Recommended Posts:
sayantanm19
Check out this Author's contributed articles.
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on  the "Improve Article" button below.