Como pegar um valor aleatório de array em JavaScript

Neste artigo você vai aprender a como pegar um valor aleatório de array em JavaScript, de uma forma simples e intuitiva

pegar um valor aleatório de array capa

Fala programador(a), beleza? Bora aprender mais sobre aleatoriedade, arrays e também sobre JavaScript!

É muito fácil realizar esta tarefa com JS, vamos precisar de 4 itens:

  • O array;
  • Saber a quantidade de elementos do array;
  • Gerar um número aleatório;
  • Arredondar este número aleatório;

O interessante é que o JavaScript possui funções para todos estes itens, veja um exemplo prático de como escolher um item aleatório em um array:

const numeros = [5, 50, 40, 30, 10, 2];

const numero = Math.floor(Math.random() * numeros.length);

console.log(numeros[numero]); // resultado aleatório

Com este código é possível obter o item aleatório!

Formação Claude Code
Formação Recomendada

Formação Claude Code

Domine Claude Code do absoluto zero até o avançado

  • 120 aulas
  • 4 projetos
  • 9h 45min

Explicando:

A propriedade length no array nos dá a quantidade de itens que ele possui, para gerarmos um número aleatório dentro dos possíveis itens

Já Math.random() gera um número aleatório, multiplicando por length temos um número até a quantidade máxima de itens

Porém é gerado um float, arredondamos com floor, pois ele arredonda para baixo

Se arredondarmos para cima, temos risco do número gerado ser um número maior que a quantidade de elementos

No console.log acessamos o índice aleatório gerado por meio do nosso código, isso faz com que o item aleatório do array seja exibido!

Então na verdage geramos um índice, e depois acessamos o elemento do array =)

Conclusão

Neste artigo você aprendeu a pegar um valor aleatório de array em JavaScript

Utilizamos algumas funções nativas da linguagem para gerar um índice, que é uma posição do array de elementos

Depois basta acessar o array com este índice gerado, sempre teremos um novo item sendo exibido, pois é escolhido de forma aleatória

Confira nossos cursos gratuitos no Youtube, com vídeos todos os dias!

Se inscreva e ative o sininho para receber as notificações e aprender mais ainda sobre desenvolvimento web!

Veja também nosso catálogo de cursos na Udemy, todos com exercícios e projetos práticos, nas mais diversas tecnologias

O link acima contém um cupom de desconto para os cursos!

Se você vai pegar item aleatório em vários lugares do código, vale transformar isso numa função pra não repetir a lógica toda hora

function itemAleatorio(array) { const indice = Math.floor(Math.random() * array.length) }

console.log(itemAleatorio(numeros)) // resultado aleatório

Agora é só chamar itemAleatorio() passando qualquer array e ela te devolve um elemento na hora

Bem mais limpo, né?

Funciona!

O exemplo do post usa números, mas o índice aleatório não liga pro tipo do que tá dentro do array

Pode ser texto, objeto, o que for

const indice = Math.floor(Math.random() * frutas.length)

A mesma lógica de gerar índice e acessar a posição vale pra qualquer array, se liga

Às vezes você não quer um item só, quer sortear vários e sem repetir nenhum

O caminho aqui é embaralhar o array e pegar os primeiros

const tres = embaralhado.slice(0, 3) console.log(tres) // 3 itens aleatórios sem repetição

Depois o sort com Math.random embaralha, e o slice pega a quantidade que você quiser

Simples e resolve

Essa é a pegadinha que já ferrou muita gente

O floor arredonda pra baixo, então o maior índice possível fica sempre dentro do array

Já o round pode arredondar pra cima e gerar um índice que não existe, aí você recebe undefined do nada

Exemplo: num array de 6 itens os índices vão de 0 a 5

Se o round te devolver 6, não tem posição 6, e o valor volta undefined

Por isso floor é o certo aqui, tome cuidado com isso

Leia também

Escrito por | Matheus Battisti

Matheus Battisti
Fundador da Hora de Codar

Programador apaixonado pelo mundo das tecnologias, sempre buscando em aprender e se aprofundar em linguagens, frameworks e o que mais for necessário para executar um bom trabalho. Agora tem uma nova missão que é de passar seu conhecimento adiante para formar novos programadores e especializar mais os que já são.

Subscribe
Notify of
guest

0 Comentários
Oldest
Newest Most Voted

Formações

Formação Vibe Coding

Formação Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

  • 474 aulas
  • 20 projetos
  • 39h 27min

Blog | Mais populares