Resposta sucinta:
Este é o comportamento "normal" em JavaScript. A linguagem tem avançado e hoje já é possível usar const
para declarar constantes que não podem ser sobrescritas.
Resposta alongada:
Desde o inicio que JavaScript permite sobrescrever nomes de variáveis e funções, e até mesmo atribuir valores a variáveis sem as declarar, "declarando-as" em escopo global, o que tem gerado bugs difíceis de detectar.
Nas versões modernas de JavaScript muito disto tem vindo a ser corrigido e para o teu caso a correção é usar const
, atribuindo a uma variável uma função.
Assim em ECMAScript 2015 (a versão 6 de JavaScript) existe const
que inicia uma variável que não pode ser mais sobre-escrita sem gerar erro de compilação.
As tuas perguntas:
- Esse é realmente o comportamento esperado quando declaramos 2
métodos com o mesmo nome e parâmetros no js, ele irá sempre
sobrescrever e vai prevalecer o último declarado?
Sim. A não ser que uses const
(que vai gerar um erro caso os nomes sejam iguais). Esse é o comportamento normal, igual ao CSS, o ultimo a ser declarado pervalece.
- Existe alguma explicação para esse comportamento, se sim qual é essa
explicação?
É assim que a linguagem foi construída, meio flexível... Mas está a ser reforçada/corrigida nas novas versões.
- Existe alguma forma de fazer que gere algum erro ou algo do tipo
caso alguém cometa esse equivoco e declare 2 métodos com o mesmo
nome e parâmetros?
Sim, usando const
o problema fica corrigido. Ou seja, dá erro caso uma variável seja sobre-escrita. Nesse caso podes usar:
const teste = function(){
console.log('teste 1');
}
e se fizeres seguidamente const teste = outra coisa...
o compilador dá erro e não corre.
- Caso a 3 tenha alguma maneira de fazer, o que fazer caso as funções
estejam em arquivos js diferentes?
Nesse caso tens de encapsular as coisas. Ou usas módulos CJS, AMD ou ES6. Ainda não há uma especificação universal por parte da linguagem, mas há propostas que estão em análise nesse sentido. Se usares o compilador da Babel já podes usar esses modulos.
Assim há duas respostas:
Com módulos compilados podes declarar tudo no escopo "global" pois o módulo não partilha esse escopo com outros ficheiros. Todas as variáveis ficam encapsuladas e a unica coisa que podes exportar para fora do módulo é via a palavra reservada exports
. Um exemplo:
function teste(){
console.log(1);
}
module.exports = teste;
dessa maneira teste
não é visivel a outros ficheiros.
Usando JavaScript nativo, onde todos os ficheiros partilham o espaço global:
Aqui tens de encapsular tu próprio as coisas. O conceito é idêntico mas tens de usar IIFEs para esconder as variáveis umas das outras.
Por exemplo:
// ficheiro A
(function(global) {
function teste() {
console.log('teste A');
}
global.testeA = teste;
})(this);
// ficheiro B
(function(global) {
function teste(nr) {
var res = nr * nr;
console.log('teste B', res);
}
global.testeB = teste;
})(this);
testeA();
testeB(17);
function adiciona(produto) { console.log(produto); } function adiciona(produto, categoria) { console.log(produto, categoria); } adiciona(1); adiciona(1, 2);
não funcionou, ao menos o artigo deu a entender que funciona :/ (testado no Chrome)(function () { function adiciona(produto) { console.log("função 1", produto); } function adiciona(produto, categoria) { console.log("função 2", produto, categoria); } adiciona(1); adiciona(1, 2); })();
, e mesmo assim o unico resultado é a"função 2"
.