Entrar Ainda não tem acesso?
3
respostas

Sobre o parâmetros da função

Referente ao curso JavaScript para Web: Crie páginas dinâmicas, no capítulo Iterando em listas e atividade Funções com parâmetros

por GERALDO PEDRO DE HOLANDA JÚNIOR
| 59.6k xp | 57 posts
function tocaSomPom () {
    document.querySelector('#som_tecla_pom').play();
}

nessa função eu consigo entender como que foi feito pra acessar o #somteclapom, usando o querySelector. Porem quando vamos otimizar, nós mudamos essa fuunção pra isso:

function tocaSom (idElementoAudio){
    document.querySelector(idElementoAudio).play();
}

a partir daqui, embora eu tenha conseguido seguir eu não compreendi como que essa função está acessando o #somteclapom, entendi que agora cada tag audio vai informar seu id ali em cima no parâmetro da função tocaSom, e que esse parâmetro vai passar essa informação ali pro querySelector, mas não entendi como esse caminho está sendo feito, porque seguindo essa lógica qualquer outra tag tambem deveria passar seu id pro parâmetro da function tocaSom.

3 respostas
por Natan Souza
| 2101.7k xp | 3699 posts
Instrutor Product Design Lead

Oi Geraldo!

A função tocaSom foi modificada para aceitar um parâmetro idElementoAudio. Esse parâmetro é uma string que representa o ID do elemento de áudio que você deseja tocar. Quando você chama a função tocaSom e passa um ID como argumento, essa informação é usada dentro da função para selecionar o elemento de áudio correspondente com document.querySelector(idElementoAudio).

Por exemplo, se você chamar tocaSom('#som_tecla_pom'), a função vai substituir idElementoAudio por '#som_tecla_pom' e o querySelector vai buscar o elemento com esse ID na página.

Quando você menciona que "qualquer outra tag também deveria passar seu id pro parâmetro da function tocaSom", você está absolutamente certo! Isso é exatamente o que torna essa função mais flexível e reutilizável. Você pode passar o ID de qualquer elemento de áudio para a função tocaSom, e ela vai tentar tocar o som associado a esse elemento.

Por exemplo, se você tiver um elemento de áudio com o ID #som_tecla_tic, você pode chamar tocaSom('#som_tecla_tic') para tocar o som associado a essa tecla. Isso permite que você use a mesma função para tocar diferentes sons, simplesmente passando diferentes IDs como argumentos.

Espero ter ajudado e bons estudos!

por GERALDO PEDRO DE HOLANDA JÚNIOR
| 59.6k xp | 57 posts

então o (idElementoAudio) que é um parâmetro, é uma variável?

por Natan Souza
| 2101.7k xp | 3699 posts
Instrutor Product Design Lead

Oi Geraldo,

Não, (idElementoAudio) não é uma variável, mas sim um parâmetro da função tocaSom.

Em JavaScript, os parâmetros são nomes de variáveis que você define na assinatura da função para que ela possa aceitar valores quando é chamada. No caso do código, idElementoAudio é o nome do parâmetro.

Quando você chama a função tocaSom em algum lugar do seu código, você precisa fornecer um valor para idElementoAudio, que será então utilizado dentro da função. Por exemplo:


tocaSom("#meuAudioElemento");

No exemplo acima, "#meuAudioElemento" é o valor passado como argumento para o parâmetro idElementoAudio. Dentro da função, esse valor será utilizado no método document.querySelector(idElementoAudio).play() para encontrar o elemento HTML com o ID correspondente e executar o método play() nele.

Espero ter ajudado e bons estudos!