Dúvida sobre função

Olá Henrique bom dia,

Se possível poderia mostrar o seu HTML para que possamos ver como ele está construído?

Acho que está acontecendo que, quando você chama a sua função 'tocaSom()', ela executa várias coisas ao mesmo tempo, inclusive as funções 'play()' no momento da chamada da sua execução. Uma forma da sua função funcionar seria colocar uma classe em todos os sons, por exemplo class = "som".

    <audio src="sounds/keyq.wav" class="som" id="som_tecla_pom"></audio>
    <audio src="sounds/keyw.wav" class="som" id="som_tecla_clap"></audio>
    <audio src="sounds/keye.wav" class="som" id="som_tecla_tim"></audio>
    <audio src="sounds/keya.wav" class="som" id="som_tecla_puff"></audio>
    <audio src="sounds/keys.wav" class="som" id="som_tecla_splash"></audio>
    <audio src="sounds/keyd.wav" class="som" id="som_tecla_toim"></audio>
    <audio src="sounds/keyz.wav" class="som" id="som_tecla_psh"></audio>
    <audio src="sounds/keyx.wav" class="som" id="som_tecla_tic"></audio>
    <audio src="sounds/keyc.wav" class="som" id="som_tecla_tom"></audio>

Em seguida vc usa o .querySelectorAll, como fez para os botões:

const listaDeTeclas = document.querySelectorAll('.tecla');
const listaDeSons = document.querySelectorAll('.som');

Então, dentro da sua função 'tocaSom()', você pode criar outras funções para encapsular a função 'play()' dentro delas. No exemplo eu vou usar uma forma de declarar funções chamada de função seta, posso estar errado quanto ao nome, porque temos apenas um comando para a função e o código fica menor, mas ela é a mesma coisa que a forma convencional. Esta função seta ficaria assim, por exemplo:

const somTecla01 = () => listaDeSons[0].play();

E o comando que vai verificar o clique do usuário ficará assim:

listaDeTeclas[0].onclick = somTecla01;

Claro que estes dois códigos vão estar dentro da sua função 'tocaSom()', o resultado seria esse:

const listaDeTeclas = document.querySelectorAll('.tecla');
const listaDeSons = document.querySelectorAll('.som');

function tocaSom(){
    /*As funções entregando o play para cada som*/
   const somTecla01 = () => listaDeSons[0].play();
   const somTecla02 = () => listaDeSons[1].play();
   const somTecla03 = () => listaDeSons[2].play();
   const somTecla04 = () => listaDeSons[3].play();
   const somTecla05 = () => listaDeSons[4].play();
   const somTecla06 = () => listaDeSons[5].play();
   const somTecla07 = () => listaDeSons[6].play();
   const somTecla08 = () => listaDeSons[7].play();
   const somTecla09 = () => listaDeSons[8].play();
    /*E elas sendo indicadas para o evento 'onclick' de cada botão*/
   listaDeTeclas[0].onclick = somTecla01;
   listaDeTeclas[1].onclick = somTecla02;
   listaDeTeclas[2].onclick = somTecla03;
   listaDeTeclas[3].onclick = somTecla04;
   listaDeTeclas[4].onclick = somTecla05;
   listaDeTeclas[5].onclick = somTecla06;
   listaDeTeclas[6].onclick = somTecla07;
   listaDeTeclas[7].onclick = somTecla08;
   listaDeTeclas[8].onclick = somTecla09;
}

tocaSom()

Acho que dessa forma sua função vai funcionar. Funcionou aqui no meu. Como se essa não fosse uma frase comum na programação. kkkkkk, Mas isso não é muito diferente do que a professora mostrou no inicio da aula 3 de listas. Acho que ainda assim fica muito verborrágico.