Consegui fazer tudo funcionar, mas não entendi a lógica de funcionamento da programação. Primeiramente o programa busca e lista todos "buttons". Tranquilo, depois entra no* for * e faz a ligação entre nome das classes de "buttons" com os nomes das classes de audios, o funcionamento do trabalho com string é facilmente entendido. O meu problema é entender por que os eventos onclick ficam dentro do for ? Teoricamente o for funcionaria em apenas um ciclo de contagem do contador, então a leitura de movimentos da página ficaria travada. Eu não entendo o que acontece quando surge o evento, para qual ponto da programação parte o sinal de clique e como funciona o fluxo da lógica dentro do js para responder ao evento. Gostaria de entender esse fluxo para poder desenvolver melhor e ter uma visão mais ampla da ligação dos eventos com sua interpretação.
3
respostas
respostas
[Dúvida] Quero entender o fluxo de processamento da programação para melhorar a compreensão
Oi, Renato
Este "for" vai ser executado no carregamento da página
Estes comandos vão atribuir uma função ao evento "onclick" de cada "button"
Isso altera os "button", e não precisa se repetir, pois vai fazer parte de cada "button"
Exemplo de alterar o "Text" dos "button"
const listaDeTeclas = document.querySelectorAll('.tecla');
for (let i = 0; i < listaDeTeclas.length; i++)
listaDeTeclas[i].innerText = i+1;
Isso vale para o "onclick". Depois de alterado, faz parte de cada "button"
Muito obrigado, Luis. Então, só para fechar meu entendimento. O for "gravou" toda essa programação que está dentro dele em cada 'button'. Como se cada um deles tivesse esse código. Quando ativo um deles, disparo o evento .onclick do 'button' específico que envia a informação para a função tocaSom. Seria mais ou menos isso?
Isso mesmo 