Olá Nathan! Tudo ok contigo?
Como o Rodrigo já mencionou, o seu raciocínio está certo! Isso que você fez, em termos mais gerais, é chamado de "passagem de argumentos" para uma função. O parâmetro contexto
age como uma variável local dentro da função, e quando você chama a função, você fornece o valor que você deseja que seja usado para esse parâmetro na chamada específica.
Não há um nome específico para essa técnica, pois isso faz parte do funcionamento padrão de passagem de argumentos em programação. Quando você define uma função com parâmetros, você pode fornecer valores específicos quando chama essa função. Isso é fundamental para a reusabilidade de funções, pois permite que você personalize o comportamento da função com diferentes dados de entrada.
Como um bônus, vou dar uma passada mais geral nas técnicas usadas no código:
Funções Anônimas: Você está criando funções sem nome diretamente no local onde são necessárias. Essas funções não precisam ser declaradas com antecedência, como as funções nomeadas. (() => {}
)
Callbacks: A função que você passa como argumento para addEventListener
é um callback. Isso significa que ela será chamada de volta quando o evento ocorrer (neste caso, um clique nos botões).
Closures: As funções de seta têm a capacidade de "capturar" variáveis do escopo ao seu redor. No seu caso, a função do evento tem acesso ao valor do argumento 'contexto' da função externa (alterarContexto
), mesmo que essa função externa já tenha terminado de ser executada.
Essa técnica é poderosa porque permite que você escreva código mais conciso e expressivo. A função de seta inline
é uma forma de definir rapidamente pequenas funções sem a necessidade de criar uma função nomeada separada.
Portanto, a expressão () => { alterarContexto('foco') }
é uma função de seta anônima que será chamada quando o botão 'focoBt'
for clicado. Essa função, por sua vez, chama alterarContexto('foco')
.
Era isso, se precisar de mais algo, ou tiver alguma dúvida acerca de algo é só me informar!
Abraços e bons estudos.