O motivo está descrito na documentação:
Primitive parameters (such as a number) are passed to functions by value; the value is passed to the function, but if the function changes the value of the parameter, this change is not reflected globally or in the calling function.
Ou seja, parâmetros primitivos (como um número) são passados para funções por valor: isso quer dizer que o valor é passado para a função, mas se a função mudar o valor do parâmetro, esta mudança não se reflete fora dela.
Isso quer dizer que esta função:
function change(val) {
val = 3;
}
muda o valor do parâmetro val
, mas esta mudança não se reflete fora da função.
Aliás, uma função criada com a palavra-chave
function
nem sempre é equivalente à arrow function (que é a sintaxe que você usou). Claro que em muitos casos "funcionará" da mesma forma, mas existem diferenças importantes entre essas duas opções. Tenho visto muita gente usando arrow function sem pensar, achando que é o único jeito (ou o "jeito moderno") de declarar uma função, mas para casos como o seu, não há ganho nenhum em usá-las, e eu prefiro criar umafunction
normal mesmo.
E faz sentido que seja assim. Por exemplo, eu posso chamar a função desta forma:
change(10);
Passei o valor diretamente, sem nenhuma variável externa à função. Se a função mudasse o valor que está fora dela, ao fazer val = 3
, o que exatamente seria mudado? O 10
? Não faz sentido.
E se eu chamasse assim?
change(outraFuncao() * 10 + 5);
Supondo que outraFuncao
é uma função que retorna algum valor, e eu ainda multiplico-o por 10 e somo 5, e o resultado é passado para change
. Se a função change
mudasse o valor que está fora dela, o que exatamente seria alterado?
Ou seja, na minha humilde opinião, não faz sentido que a atribuição feita dentro da função reflita fora dela.
Resumindo, se você faz:
function change(val) {
val = 3;
}
let a = 2;
change(a);
O valor de a
é copiado para o parâmetro val
. Dentro da função, val
tem seu valor alterado, mas esta alteração não reflete em a
(já que val
é apenas uma cópia do valor de a
). Quando a função encerra sua execução, val
é descartada (pois ela só existe dentro da função). E a
segue com seu valor inalterado.
Por fim, é interessante conhecer os conceitos de passagem por valor e por referência para entender melhor o que acontece. E para se aprofundar especificamente no JavaScript, leia aqui.