O que é substituição em JavaScript?

Para entender o conceito de substituição no JavaScript, primeiro revisemos o conceito de substituição como um todo.

A Substituição de Método é um conceito de POO estreitamente associado à herança. Quando um método de classe filho substitui o método de classe pai com o mesmo nome, parâmetros e tipo de retorno, é denominado como substituição de método. Além disso, lembre-se de que isso é completamente diferente do conceito de sobrecarga de método. A sobrecarga de método ocorre quando há duas funções com o mesmo nome, mas com parâmetros diferentes.

Agora, vamos tentar entender esse conceito do ponto de vista do JavaScript. Sabemos que o JavaScript "relativamente" não é orientado a objetos. Ele tem o conceito de Objetos que o qualifica para ser orientado a objetos, mas não tem o conceito de Classes. É de natureza prototípica. Sim, sim, ouvi você gritando alto que podemos declarar classes em JavaScript, mas deixe-me lembrá-lo de que essa notação de classe é apenas um açúcar sintático para a arquitetura prototípica subjacente.

Portanto, o JavaScript suporta o conceito de substituição de método. E faz isso de maneiras muito estranhas. Afinal, é a linguagem mais incompreendida no mundo da programação. O JavaScript suporta a substituição, mas não a sobrecarga.

Nota - Nos exemplos deste artigo, estaríamos usando o console do desenvolvedor dos navegadores. Simplesmente abra as ferramentas de desenvolvedor do navegador (Ctrl / Cmd + Shift + C) e vá para a guia Console na janela de ferramentas do desenvolvedor.

É assim no Chrome:

Este é o playground para a maioria dos conceitos relacionados ao JavaScript. Nós estaríamos usando esse playground ao longo deste artigo.

Como funciona a substituição em JavaScript?

No JavaScript, todos os objetos são herdados do protótipo de objeto. Todos os objetos são instâncias de Object. Portanto, sempre que você cria um novo objeto, o JavaScript define automaticamente uma propriedade _proto_ (prototype) para o novo objeto. Quando um objeto filho é criado, ele novamente tem uma propriedade _proto_ e assim por diante. Agora, quando você tenta acessar um método ou propriedade de um objeto, o JavaScript primeiro verifica se o objeto possui esse método / propriedade. Caso contrário, o JavaScript verifica se o _proto_ do objeto possui esse método / propriedade. Caso contrário, o JavaScript verifica se o _proto_ do objeto pai possui esse método / propriedade. Ele continua pesquisando a cadeia até que o método / propriedade seja encontrado ou o _proto_ do Object seja encontrado e pesquisado. Por exemplo, Date.prototype. ((Prototype)) é Object.prototype.

Agora veja a corrente de cabeça para baixo. É assim que a substituição funciona em JavaScript. Um método continuaria substituindo o método do objeto pai, mesmo que seja um método de Object. Por exemplo, podemos até substituir a funcionalidade principal, como criar um objeto Date.

Vamos ver isso com um exemplo:

new Date(); //the JavaScript Date() method
//overriding the JavaScript Date() method
function Date()(
this.date = "This method overrides the default constructor of Date class.";
);
var date2 = new Date();
console.log(date2);

Tipos de substituição em JavaScript

Não há tipos de substituição definidos em JavaScript. No entanto, com base no comportamento da linguagem de programação, podemos dizer que a substituição do método no JavaScript funciona das seguintes maneiras.

1) O primeiro comportamento

A primeira maneira é a que vimos acima quando definimos um método para substituir o construtor Date padrão do JavaScript. Isso é semelhante à terceira maneira ilustrada abaixo, porque todos os objetos em JavaScript são uma instância do protótipo de Objeto. O que diferencia o terceiro comportamento é o uso da super palavra-chave. Veremos mais quando ilustrarmos o terceiro comportamento.

Vamos ver outro exemplo semelhante. Dessa vez, substituiríamos a funcionalidade de alerta. O comportamento padrão da função de alerta no JavaScript é exibir uma pequena caixa de diálogo na parte superior da página com a mensagem que passamos como parâmetro.

Agora, quando o substituímos por nosso próprio código, a função de alerta padrão não é mais chamada.

function alert(msg) (
console.log(msg);
);
alert("This is an alert.");

2) O segundo comportamento

A segunda maneira é quando tentamos sobrecarregar funções em JavaScript. Lembre-se de que o JavaScript não suporta sobrecarga de funções. Portanto, em vez de sobrecarregar sua função, o JavaScript substituirá todas as definições anteriores da sua função pela mais recente.

Vamos ver isso em ação.

//Calculate area of rectangle
function calculateArea(x, y)(
return x*y;
)
//Calculate area of square
function calculateArea(a)(
return a*a;
)
console.log("Area of rectangle 2x3 is : " + calculateArea(2, 3));
console.log("Area of square 5x5 is : " + calculateArea(5));

Observe o resultado. O JavaScript sempre chama a segunda definição da função e retorna o quadrado do primeiro parâmetro. Os parâmetros subseqüentes são ignorados.

3) O terceiro comportamento

O terceiro comportamento aparece quando envolvemos classes e herança em JavaScript. Quando uma classe filho herda os métodos da classe pai e define seus próprios métodos com o mesmo nome, os métodos da classe pai são substituídos. Não é isso que queremos em aplicativos da vida real. Queremos que nossos métodos de classe pai sejam acessíveis mesmo quando substituídos por métodos de classe filho. Portanto, a super palavra-chave vem em nosso socorro. Usando a super palavra-chave, podemos acessar os métodos da classe pai.

Vamos ver isso em ação.

//the parent class
class Person (
greet() (
console.log("Hello. I am a person.");
);
)
//the child class
class Employee extends Person (
greet() (
super.greet(); //calling parent class method via keyword 'super'
console.log("Hello. I am an employee.");
)
)
let per = new Person(); //parent class object
let emp = new Employee(); //child class object
per.greet();
emp.greet();

Agora volte ao primeiro exemplo de comportamento e tente usar a super palavra-chave lá. Você notaria que não funciona. Isso ocorre porque, quando criamos nosso método no primeiro exemplo, não estendemos a classe pai. Criamos o método no escopo global, substituindo, assim, todas as outras definições do método.

Conclusão

Vamos revisar nossa compreensão da substituição de método em JavaScript. Aprendemos que o JavaScript suporta a substituição, mas não a sobrecarga. Se tentarmos sobrecarregar métodos, o JavaScript substituirá todas as definições anteriores pela mais recente. Isso é verdade mesmo para as funções principais!

Em seguida, vimos como podemos substituir métodos em classes filho e, posteriormente, acessar métodos de classe pai como e quando necessário. Esse é um conceito muito útil, pois nos permite estender a funcionalidade de nossas classes pai e, assim, melhora a reutilização do código.

Artigos recomendados

Este é um guia para Substituir em JavaScript. Aqui discutimos Como funciona a substituição em JavaScript e Tipos de substituição em JavaScript. Você também pode consultar o seguinte artigo para saber mais -

  1. O que Javascript pode fazer?
  2. O que é JavaScript?
  3. Como instalar o JavaScript
  4. Frameworks Python - o que é framework python?
  5. Introdução à substituição em C ++
  6. Introdução à substituição em OOPs
  7. Substituindo em Java
  8. Sobrecarga de método em C #
  9. Sobrecarregando e substituindo em c #