Generate random alpha-numeric string in JavaScript - GeeksforGeeks

24 Jun, 2019
The task is to generate a random alpha-numeric string of specified length using javascript, we’re going to discuss few techniques.
Approach 1:
Creates a function which takes 2 arguments one is the length of the string that we want to generate and another is the characters that we want to be present in the string.
Declare new variable ans = ‘ ‘.
Traverse the string in reverse order using for loop.
Use JavaScript Math.random() method to generate the random index and multiple with the length of string.
Use JavaScript Math.floor( ) to round off it and add into the ans.
Example 1: This example uses the Math.random() method to generate the random index and then appends the character from the string we passed.
<!DOCTYPE HTML><html>  <head>    <title>        Generate random         alpha-numeric string in JavaScript     </title></head>  <body style="text-align:center;"      id="body">    <h1 style="color:green;">              GeeksForGeeks          </h1>    <p id="GFG_UP"        style="font-size: 19px;              font-weight: bold;">    </p>    <button onClick="GFG_Fun()">        click here    </button>    <p id="GFG_DOWN"        style="color: green;               font-size: 24px;               font-weight: bold;">    </p>    <script>        var up = document.getElementById('GFG_UP');        var down = document.getElementById('GFG_DOWN');        up.innerHTML =           'Click on the button to generate alpha-numeric string';          function randomStr(len, arr) {            var ans = '';            for (var i = len; i > 0; i--) {                ans +=                   arr[Math.floor(Math.random() * arr.length)];            }            return ans;        }          function GFG_Fun() {            down.innerHTML = randomStr(20, '12345abcde');        }    </script></body>  </html>
Output:
Before clicking on the button:
After clicking on the button:
Approach 2:
First generate a random number using Math.random() method.
Use JavaScript toString(36) to convert it into base 36 (26 char + 0 to 9) which is also alpha-numeric string.
Use JavaScript String.slice() method to get the part of string which is started from position 2.
Example 2: This example first generate a random number(0-1) and then converts it to base 36 which is also alpha-numeric string by using toString(36)() method.
<!DOCTYPE HTML><html>  <head>    <title>      Generate random alpha-numeric string      in JavaScript    </title></head>  <body style="text-align:center;"       id="body">    <h1 style="color:green;">              GeeksForGeeks          </h1>    <p id="GFG_UP"        style="font-size: 19px;              font-weight: bold;">    </p>    <button onClick="GFG_Fun()">        click here    </button>    <p id="GFG_DOWN"        style="color: green;              font-size: 24px;               font-weight: bold;">    </p>    <script>        var up = document.getElementById('GFG_UP');        var down = document.getElementById('GFG_DOWN');        up.innerHTML =           'Click on the button to generate alpha-numeric string';          function GFG_Fun() {            down.innerHTML =              Math.random().toString(36).slice(2);        }    </script></body>  </html>
Output:
Before clicking on the button:
After clicking on the button:
JavaScript-Misc
JavaScript
Web Technologies
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Comments
Old Comments
Difference between var, let and const keywords in JavaScript
Convert a string to an integer in JavaScript
Differences between Functional Components and Class Components in React
How to append HTML code to a div using JavaScript ?
How to Open URL in New Tab using JavaScript ?
Express.js express.Router() Function
Installation of Node.js on Linux
Convert a string to an integer in JavaScript
How to set the default value for an HTML <select> element ?
Top 10 Angular Libraries For Web Developers