Herança em JavaScript: O que é e como implementá-la

Entenda o conceito de herança em JavaScript, como ela pode ser aplicada em classes e os benefícios dessa abordagem para a organização do código.

O que é herança em JavaScript e como implementá-la?

A herança é um conceito fundamental na Programação Orientada a Objetos (OOP) que permite que uma classe herde propriedades e métodos de outra classe. Esse conceito é extremamente útil para reutilização de código, permitindo que você defina comportamentos comuns em uma classe base e, em seguida, crie novas classes que herdem essas funcionalidades, sem a necessidade de reescrever o código.

Em JavaScript, a herança pode ser implementada de duas maneiras principais: através de prototipagem (herança prototípica) ou usando a sintaxe de classes introduzida no ECMAScript 6 (ES6). Vamos explorar as duas abordagens para implementar herança em JavaScript.

Herança prototípica em JavaScript

JavaScript usa herança prototípica para compartilhar propriedades e métodos entre objetos. Isso significa que um objeto pode herdar diretamente de outro objeto através de seu protótipo. A herança prototípica é poderosa, mas a sintaxe pode ser um pouco mais difícil de entender, especialmente para quem está começando.

Exemplo de herança prototípica:

function Animal(nome) {
  this.nome = nome;
}

Animal.prototype.falar = function() {
  console.log(`${this.nome} faz um som.`);
};

function Cachorro(nome, raca) {
  Animal.call(this, nome);
  this.raca = raca;
}

Cachorro.prototype = Object.create(Animal.prototype);
Cachorro.prototype.constructor = Cachorro;

Cachorro.prototype.latir = function() {
  console.log(`${this.nome} está latindo!`);
};

const cachorro1 = new Cachorro('Rex', 'Pastor Alemão');
cachorro1.falar();
cachorro1.latir();

O que o código está fazendo: A função construtora Animal define um método falar que pode ser compartilhado entre todos os objetos criados com essa função. A função construtora Cachorro herda de Animal através do uso de Object.create(Animal.prototype) e Cachorro.prototype.constructor = Cachorro, o que estabelece a cadeia de protótipos. Além disso, o método latir é definido para a classe Cachorro.

Neste exemplo, cachorro1 é uma instância da classe Cachorro que herda o método falar de Animal e tem o método próprio latir.

Herança usando classes em JavaScript

Com a introdução de classes no ECMAScript 6 (ES6), o conceito de herança em JavaScript ficou mais simples e intuitivo. A herança agora pode ser implementada usando a palavra-chave extends, permitindo que uma classe herde de outra diretamente.

Exemplo de herança com classes:

class Animal {
  constructor(nome) {
    this.nome = nome;
  }
  falar() {
    console.log(`${this.nome} faz um som.`);
  }
}

class Cachorro extends Animal {
  constructor(nome, raca) {
    super(nome);
    this.raca = raca;
  }
  latir() {
    console.log(`${this.nome} está latindo!`);
  }
}

const cachorro1 = new Cachorro('Rex', 'Pastor Alemão');
cachorro1.falar();
cachorro1.latir();

O que o código está fazendo: A classe Cachorro herda da classe Animal através da palavra-chave extends. O método super(nome) é chamado no construtor de Cachorro para invocar o construtor da classe Animal e garantir que o nome seja corretamente inicializado. A classe Cachorro também define o método latir, que é exclusivo para os cachorros.

Essa abordagem com classes facilita a implementação de herança, tornando o código mais claro e fácil de entender.

Por que usar herança em JavaScript?

A herança oferece uma série de benefícios no desenvolvimento de aplicações em JavaScript:

  • Reutilização de código: Ao definir métodos e propriedades em uma classe base, você pode reutilizar o código em várias subclasses, evitando duplicação.
  • Facilidade de manutenção: Alterações feitas na classe base serão refletidas em todas as subclasses, o que facilita a manutenção e a evolução do código.
  • Estrutura mais organizada: A herança permite que você defina uma hierarquia de objetos, o que torna seu código mais modular e fácil de entender.

Polimorfismo e herança em JavaScript

O polimorfismo é um conceito relacionado à herança, onde um método pode ser sobrescrito nas subclasses para proporcionar comportamentos diferentes. Em JavaScript, isso pode ser feito simplesmente criando um método com o mesmo nome na subclasse.

Exemplo de polimorfismo:

class Animal {
  falar() {
    console.log('O animal faz um som.');
  }
}

class Cachorro extends Animal {
  falar() {
    console.log('O cachorro late.');
  }
}

class Gato extends Animal {
  falar() {
    console.log('O gato mia.');
  }
}

const cachorro = new Cachorro();
cachorro.falar();  // O cachorro late.
const gato = new Gato();
gato.falar();  // O gato mia.

Neste exemplo, as classes Cachorro e Gato sobrescrevem o método falar da classe base Animal, permitindo comportamentos diferentes, mas mantendo a mesma interface.

Conclusão

A herança é um dos pilares da Programação Orientada a Objetos e é amplamente utilizada em JavaScript para promover o reuso de código e a criação de estruturas mais organizadas. Com a introdução das classes no ES6, a herança ficou mais simples e intuitiva, permitindo que você crie hierarquias de objetos com facilidade. Usando a palavra-chave extends, você pode criar novas classes que herdam funcionalidades de outras, facilitando a manutenção e a escalabilidade do seu código.

Com a introdução das classes no ECMAScript 6, o conceito de herança em JavaScript ficou mais simples e intuitivo. A herança permite a criação de hierarquias entre objetos, promovendo a reutilização de código e melhorando a organização e manutenção do código.

Algumas aplicações:

  • Reutilização de código em projetos grandes e complexos.
  • Criação de hierarquias lógicas entre objetos para organizar dados e comportamentos.
  • Facilidade de manutenção e escalabilidade do código.

Dicas para quem está começando

  • Comece criando uma classe base com propriedades e métodos comuns e, em seguida, crie subclasses que herdam essas funcionalidades.
  • Pratique utilizando super para acessar métodos da classe base em subclasses.
  • Estude o conceito de polimorfismo, que é a capacidade de sobrescrever métodos em classes derivadas.
  • Evite criar heranças muito profundas, pois elas podem tornar o código mais difícil de entender.

Contribuições de Andressa Maria

Compartilhe este tutorial: O que é herança em JavaScript e como implementá-la?

Compartilhe este tutorial

Continue aprendendo:

O que são métodos em uma classe e como utilizá-los?

Descubra o que são métodos em classes JavaScript e como usá-los para criar comportamentos e manipular dados em seus objetos.

Tutorial anterior

O que é o método super() e quando usá-lo?

O método `super()` é essencial para acessar métodos e propriedades da classe pai em heranças de JavaScript. Aprenda quando utilizá-lo no seu código.

Próximo tutorial