1
resposta

Momento de entrada no Loop

Olá, fiquei com uma duvida sobre o momento de ativação do loop. No JS sempre que há uma intereação todo o código é lido novamente?

function tocaSom(idSom){
    const elemento = document.querySelector(idSom);

    if (elemento.localName == 'audio' && elemento!= null){
        elemento.play();
    }

}
const listaDeTeclas = document.querySelectorAll('.tecla');

**for ( let i = 0; i < listaDeTeclas.length; i++){
    const tecla = listaDeTeclas[i];
    const instrumento = tecla.classList[1];
    const idAudio = `#som_${instrumento}`; //tamplate string

    tecla.onclick = function(){
        tocaSom(idAudio);
    }**

    tecla.onkeydown = function(evento){
        if(evento.code =='Space' || 'Enter'){
            tecla.classList.add('ativa');
        }

    }

    tecla.onkeyup =function(){
        tecla.classList.remove('ativa');
    }
}
1 resposta

Oi Fernando, tudo bem?

Desculpe a demora em responder!

Muito bacana sua dúvida, vamos pensar juntos sobre o código da estrutura de repetição.

O uso do for como laço de repetição, cria um loop das funções para todas as teclas de som que temos no Alura Midi, criando uma lista de teclas e de sons por meio das constantes (const) e permitindo a interação entre os elementos de ambas as listas por meio da posição na qual se encontram. Dessa forma, o for está sempre ativo em nosso código.

Com relação às interações, seu pensamento está correto, toda vez que for realizado um clique em algum dos botões ou a tecla "ENTER" ou "SPACE" for pressionada sobre um dos botões a função que emite o som será tocada, sendo lida linha a linha até completar todos os comandos dentro da função.

Espero ter ajudado. Caso tenha dúvidas, estarei à disposição!

Abraços!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!