Lo que quiero hacer es entregar math.random como argumento a mi función "NombreAleatorio", para que genere un numero aleatorio entre 1 y 4, el cual estoy intentando guardar en la variable Number, la cual pretendo entregar a mi arreglo Nombres, para que así al hacer un return de mi arreglo, me devuelva el nombre que concuerde con el valor de Number. El problema que tengo es que si hago un console log de mi variable Number, y hago un console log de Nombres[Number], sus valores coinciden bien, PERO cuando intento hacer un return de Nombres[Number] me devuelve un nombre que no coincide para nada con los console.log. Es importante para mi generar un numero aleatorio que pueda guardar en una variable, y que no cambie ! pues necesito usarlo después para otras cosas, sin embargo esto solo me funciona dentro de mi función, pues cuando lo uso para hacer un return, me devuelve otros valores.
const Componente = () => {
const Nombres = ["Alvaro", "Juan", "Paula", "Valentina"];
let NombreAleatorio = (val) => {
let Number = "";
if(val === 1){
Number = 0;
}else if(val === 2){
Number = 1;
}else if(val === 3){
Number = 2;
}else if(val === 4){
Number = 3;
}else{Number = 0;}
console.log(Number);
console.log(Nombres[Number]);
return Nombres[Number];
}
return (
<div>
{NombreAleatorio(Math.floor(Math.random() * 4))}
</div>
);
}
export default Componente;