He creado un password generator App. Y como veran a continuacion en el codigo, dentro de la funcion, repito cuatro veces el mismo procedimiento, para poder generar 4 contraseñas haciendo un solo click, y guardando las mismas en 4 variables distiantas, las cuales van a ser impresas en 4 inputs.
Mi objetivo es no repetir el codigo esta cantidad de veces, hacerlo mas conciso y ajustarlo a las buenas practicas.
Obviamente se me ha ocurrido usar un loop, pero no logro entender como crear 4 variables distintas ( Si es que realmente necesito crearlas, para poder luego hacer el display de las contraseñas en el input.)
const letters = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
const numbers = "0123456789";
const symbols = "!@#$%^&*_-+=";
const button = document.querySelector(".gen-pass");
const input1 = document.querySelector(".first-password")
const input2 = document.querySelector(".second-password")
const input3 = document.querySelector(".third-password")
const input4 = document.querySelector(".fourth-password")
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('');
const password2 = 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('');
const password3 = 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('');
const password4 = 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('');
input1.value = password;
input2.value = password2;
input3.value = password3;
input4.value = password4;
})