user15855068
user15855068

Reputation:

Trying to convert an Array to String (JavaScript)

I am trying to convert an array to string using array.join() or array.toString() but it's not working as it's supposed to work. When I console.log it stays as an array.

I've the intuition that this issue comes from something related to function scopes, but I could not figure it out yet.

The project I'm trying to build is a password generator.

const letters = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
const numbers = "0123456789";
const symbols = "!@#$%^&*_-+=";

const button = document.querySelector(".gen-pass");

button.addEventListener("click", (e) => {

  let password = [];
  
  for (let i = 0; i < 4; i++) {
    let randomLetters = letters[Math.floor(Math.random() * letters.length)];
    let randomNumbers = numbers[Math.floor(Math.random() * numbers.length)];
    let randomSymbols = symbols[Math.floor(Math.random() * symbols.length)];

    password.push(randomLetters, randomNumbers, randomSymbols);
    password.join();
  }

  console.log(password);
});
<button class="gen-pass">Generate!</button>

Upvotes: 0

Views: 62

Answers (5)

Taj Irwin-Wells
Taj Irwin-Wells

Reputation: 1

The easiest way I can think of is by using JSON which is known for converting data to strings. Check this stringify function out here: https://www.w3schools.com/js/js_json_stringify.asp?msclkid=e8639fd0cfa411eca470fe06b0ce6da7

Upvotes: 0

Himanshu
Himanshu

Reputation: 949

const button = document.querySelector(".gen-pass");

button.addEventListener("click", (e) => {

  e.preventDefault();

  let password = [];
  let formattedPassword = '';

  for (let i = 0; i < 4; i++) {
    let randomLetters = letters[Math.floor(Math.random() * letters.length)];
    let randomNumbers = numbers[Math.floor(Math.random() * numbers.length)];
    let randomSymbols = symbols[Math.floor(Math.random() * symbols.length)];

    password.push(randomLetters, randomNumbers, randomSymbols);

  }

  formattedPassword = password.join('');
  console.log(password, formattedPassword);
});

Upvotes: 1

Jeff B
Jeff B

Reputation: 1060

Try changing your return to the following. This moves the join to occur once at the end of password creation and removes the ,s by telling .join to replace all ,s with empty strings:

const letters = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
const numbers = "0123456789";
const symbols = "!@#$%^&*_-+=";
const button = document.querySelector(".gen-pass");

button.addEventListener("click", (e) => {

  e.preventDefault();

  let password = [];
  
  for (let i = 0; i < 4; i++) {
    let randomLetters = letters[Math.floor(Math.random() * letters.length)];
    let randomNumbers = numbers[Math.floor(Math.random() * numbers.length)];
    let randomSymbols = symbols[Math.floor(Math.random() * symbols.length)];

    password.push(randomLetters, randomNumbers, randomSymbols);
  }

  console.log(password.join(""));
});
<button type="button" class="gen-pass">Generate Password</button>

Upvotes: 0

R4ncid
R4ncid

Reputation: 7129

You can do something like this

const letters = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
const numbers = "0123456789";
const symbols = "!@#$%^&*_-+=";


const button = document.querySelector(".gen-pass");

button.addEventListener("click", (e) => {

  e.preventDefault();

  const password = Array(4).fill(0).flatMap(_ => 
    [
      letters[Math.floor(Math.random() * letters.length)],
      numbers[Math.floor(Math.random() * numbers.length)],
      symbols[Math.floor(Math.random() * symbols.length)]
    ]
  ).join('');
  

  console.log(password);
});
<button class="gen-pass">GENERATE</button>

basically this code generate and array of [letter, number, symbol, ...] and then it join them together

Upvotes: 1

daddygames
daddygames

Reputation: 1928

Array.prototype.join() returns a string. It does not change the object it is called on.

You may want to create a new variable or mutate password after the for loop has completed like so:

const letters = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
const numbers = "0123456789";
const symbols = "!@#$%^&*_-+=";
let password = [];
for (let i = 0; i < 4; i++) {
    let randomLetters = letters[Math.floor(Math.random() * letters.length)];
    let randomNumbers = numbers[Math.floor(Math.random() * numbers.length)];
    let randomSymbols = symbols[Math.floor(Math.random() * symbols.length)];

    password.push(randomLetters, randomNumbers, randomSymbols);
    
  }
  
  password = password.join('');

  console.log(password);

Upvotes: 1

Related Questions