1
resposta

[Dúvida] Os nomes da lista não aparecem(Resultado do Sorteio).

let listaDeSorteio = [];

function adicionar() {
    let nome = document.getElementById('nome-amigo');
    let lista = document.getElementById('lista-amigos');
    listaDeSorteio.push(nome.value);

    if (lista.textContent == '') {
        lista.textContent = nome.value;
    } else {
        lista.textContent = lista.textContent + ' , ' + nome.value;
    }
    nome.value = '';

}

function sortear() {
    embaralha(listaDeSorteio);
    let resultado = document.getElementById('lista-sorteio');

    for (let i = 0; i > listaDeSorteio.length - 1; i++) {
        resultado.innerHTML = resultado.innerHTML + listaDeSorteio[i] + ' --> ' + listaDeSorteio[i + 1] + '<br>';
    }
}

function embaralha(lista) {

    for (let indice = lista.length; indice; indice--) {

        const indiceAleatorio = Math.floor(Math.random() * indice);

        // atribuição via destructuring
        [lista[indice - 1], lista[indiceAleatorio]] = 
            [lista[indiceAleatorio], lista[indice - 1]];
    }
}
1 resposta

Oi, Gustavo! Tudo bem?

O problema tá na condição de parada dentro da função sortear(). Veja como você escreveu:

for (let i = 0; i > listaDeSorteio.length - 1; i++)

Aqui, você está dizendo ao JavaScript: "Comece com i igual a 0 e execute o código enquanto i for maior que o tamanho da lista menos um".

Como 0 dificilmente será maior que o número de amigos que você adicionou, a condição já nasce falsa e o código dentro das chaves nunca é executado.

Como corrigir

Pra que o sorteio apareça, você precisa mudar o sinal de maior que (>) para menor que (<). Assim, o loop vai percorrer cada item da lista até chegar ao final.

function sortear() {
    embaralha(listaDeSorteio);
    let resultado = document.getElementById('lista-sorteio');
    
    // Limpa o resultado anterior antes de exibir o novo
    resultado.innerHTML = ''; 

    // O sinal correto é < (menor que)
    for (let i = 0; i < listaDeSorteio.length - 1; i++) {
        resultado.innerHTML = resultado.innerHTML + listaDeSorteio[i] + ' --> ' + listaDeSorteio[i + 1] + '<br>';
    }
}

Um detalhe importante

Note que, da forma como o laço está estruturado (i < listaDeSorteio.length - 1), o último nome da lista não terá um par, pois o loop para um item antes.

Para um sistema de Amigo Secreto completo, o último nome da lista sorteada deve tirar a primeira pessoa da lista. Você pode resolver isso adicionando uma linha após o for:

// Faz a conexão do último com o primeiro
resultado.innerHTML += listaDeSorteio[listaDeSorteio.length - 1] + ' --> ' + listaDeSorteio[0] + '<br>';

Isso garante que o ciclo se feche. Resultado do teste:

Teste

Alura Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!