2
respostas

Resolução de Atividades - 07 Faça como eu fiz: lógica para realização do sorteio

Oiie. Corrigi um erro que estava no meu código. Agora estou retornando a função sortear de novo. Acredito que agora sim está 100% certinho. Só não entendi muito do , ele faz parte do HTML?

let amigosIncluidos = []; 
let campoAmigosIncluidos = document.getElementById ("lista-amigos");
let amigosSorteados = [];
let campoSorteados = document.getElementById ("lista-sorteio");
let campoNomeDigitado = document.getElementById ("nome-amigo");

function adicionar() {

    let nomeDigitado = document.getElementById ("nome-amigo").value;
    
    amigosIncluidos.push (` ${nomeDigitado}`);
    campoAmigosIncluidos.textContent = amigosIncluidos; 

    campoNomeDigitado.value = "";
}

function sortear() {

    amigosSorteados = [];
    campoSorteados.innerHTML = "";

    let numeroParticipantes = amigosIncluidos.length;

    for (let n = 0; n <= numeroParticipantes - 1; n++) {

        let numeroSorteado = obterNumeroAleatorio (0, numeroParticipantes - 1);

        if (amigosSorteados.includes (amigosIncluidos[numeroSorteado])) {

            return sortear();
        }

        if (amigosIncluidos[n] == amigosIncluidos[numeroSorteado]) {

            return sortear();
        }

        amigosSorteados[n] = amigosIncluidos[numeroSorteado];    
    }

    for (n = 0; n <= numeroParticipantes - 1; n++) {

        campoSorteados.innerHTML = campoSorteados.innerHTML + `${amigosIncluidos[n]} -> ${amigosSorteados[n]} <br>`;
    }
}


function reiniciar() {

    campoAmigosIncluidos.textContent = "";
    amigosIncluidos = [];
    amigosSorteados = [];
    campoSorteados.textContent = "";
    listaFinal = [];
}


function obterNumeroAleatorio (min, max) {

    return Math.floor(Math.random() * (max - min + 1)) + min;
}
2 respostas

Oi, Victor! Tudo bem?

Que bom que você conseguiu corrigir o erro no código! Em relação à dúvida do <br>, ele é sim uma parte do HTML, é uma tag que serve para quebrar linha, ou seja, ele faz com que o texto que vem após ele comece em uma nova linha e é muito útil quando queremos exibir informações em linhas separadas sem precisar criar novos elementos de bloco, como <div> ou <p>.

No nosso código, estamos usando <br> para separar visualmente cada par de amigos sorteados na lista exibida, assim, cada par "amigo -> sorteado" aparece em uma linha diferente na interface do usuário, facilitando a leitura.

Espero ter ajudado!

Um forte abraço e bons estudos!

Brabo!