[Dúvida] Erro undefined

No JS:

const controle = document.querySelectorAll ("[data-controle]");     
const estatisticas = document.querySelectorAll ("[data-estatisticas]");
const pecas = {
    "bracos": {
        "forca": 29,
        "poder": 35,
        "energia": -21,
        "velocidade": -5
    },

    "blindagem": {
        "forca": 41,
        "poder": 20,
        "energia": 0,
        "velocidade": -20
    },
    "nucleos":{
        "forca": 0,
        "poder": 7,
        "energia": 48,
        "velocidade": -24
    },
    "pernas":{
        "forca": 27,
        "poder": 21,
        "energia": -32,
        "velocidade": 42
    },
    "foguetes":{
        "forca": 0,
        "poder": 28,
        "energia": 0,
        "velocidade": -2
    }
}

function manipulaDados (operacao, controle) {
    const peca = controle.querySelector ("[data-contador]");
    if (operacao === "-") {
        peca.value= parseInt (peca.value) -1;
    } else {
        peca.value =parseInt (peca.value) +1;
    }
}

controle.forEach ((elemento) => {
    elemento.addEventListener("click", (evento) =>{
        manipulaDados(evento.target.dataset.controle, evento.target.parentNode);      
        atualizaEstatisticas(evento.target.dataset.peca);
    })
})

function atualizaEstatisticas (peca){
    estatisticas.forEach((elemento) =>{
       elemento.textContent= parseInt(elemento.textContent) + pecas[peca][elemento.dataset.estatisticas];   
    }) 
}

Obrigado desde já!

O erro que aparece no devtools:

Oi, Victor

Está faltando o "s" nos valores da "data-peca" em todos os "buttom" com problema:

"braco" deveria ser "bracos"

Olá Victor!

O erro que acontece é por conta do data-peca está com os nomes diferentes do objeto chamado lá no seu js, exemplo:

                     <div class="controle">
                            <buttom class="controle-ajuste" data-controle="-" data-peca="braco" >-</buttom>
                            <input type="text" class="controle-contador" value="00" data-contador>
                            <buttom class="controle-ajuste" data-controle="+" data-peca="braco" >+</buttom>
                     </div>

Observe que o seu data-peca está como "braco" e o seu objeto está como "bracos" lá no seu JS, dessa forma basta ajustar o seu HTML, seu código corrigido fica assim:

        <section class="equipamentos">
            <form action="" class="montador">
                <div class="box montador-conteudo">
                    <div class="peca">
                        <label for="" class="peca-titulo">Braços</label>
                        <div class="controle">
                            <buttom class="controle-ajuste" data-controle="-" data-peca="bracos" >-</buttom>
                            <input type="text" class="controle-contador" value="00" data-contador>
                            <buttom class="controle-ajuste" data-controle="+" data-peca="bracos" >+</buttom>
                        </div>
                    </div>
                    <hr class="linha">
                    <div class="peca">
                        <label for="" class="peca-titulo">Blindagem</label>
                        <div class="controle">
                            <buttom class="controle-ajuste" data-controle="-" data-peca="blindagem">-</buttom>
                            <input type="text" class="controle-contador" value="00" data-contador>
                            <buttom class="controle-ajuste" data-controle="+" data-peca="blindagem">+</buttom>
                        </div>
                    </div>
                    <hr class="linha">
                    <div class="peca">
                        <label for="" class="peca-titulo">Núcleos</label>
                        <div class="controle">
                            <buttom class="controle-ajuste" data-controle="-" data-peca="nucleos">-</buttom>
                            <input type="text" class="controle-contador" value="00" data-contador>
                            <buttom class="controle-ajuste" data-controle="+" data-peca="nucleos">+</buttom>
                        </div>
                    </div>
                    <hr class="linha">
                    <div class="peca">
                        <label for="" class="peca-titulo">Pernas</label>
                        <div class="controle">
                            <buttom class="controle-ajuste" data-controle="-" data-peca="pernas">-</buttom>
                            <input type="text" class="controle-contador" value="00" data-contador>
                            <buttom class="controle-ajuste" data-controle="+" data-peca="pernas">+</buttom>
                        </div>  
                    </div>
                    <hr class="linha">
                    <div class="peca">
                        <label for="" class="peca-titulo">Foguetes</label>
                        <div class="controle">
                            <buttom class="controle-ajuste" data-controle="-" data-peca="foguetes">-</buttom>
                            <input type="text" class="controle-contador" value="00" data-contador>
                            <buttom class="controle-ajuste" data-controle="+" data-peca="foguetes">+</buttom>
                        </div>
                    </div>
                </div>
                <input type="submit" value="Iniciar produção" class="producao" id="producao">
            </form>
        </section>

Espero ter te ajudado meu chará rsrs, e reforço que em casos de dúvidas, conte sempre com o fórum da comunidade Alura! Bons estudos!

Sucesso ✨

Um grande abraço e até mais!

Obrigado meus amigos, Luis e o meu chará Victor.

Fiz o que vocês disseram e o que aconteceu foi que a blindagem começou a funcionar. Agora só falta o núcleo e as pernas.

Aparece esse erro que não entendi o erro:

Caso queiram ver melhor o meu código, eu vou deixar aqui o meu repositório no Github: https://github.com/PolimataDigital/Robotron.git

Oi, Victor

É para colocar o "s" em TODOS os valores da "data-peca"

Faltaram:

data-peca="nucleo"

data-peca="perna"

Isso ocorre porque no arquivo "main.js" eles estão referenciados com "s".

Se o nome for diferente, a busca não terá êxito e o resultado será "indefinido".

Obrigado novamente Luis. Não prestei atenção nesses detalhes!