Heredar los métodos de otra clase utilizando la palabra clave extender en JavaScript

Con las características adicionales y la sintaxis de clase más simple, ES6 hizo que JavaScript fuera mucho más simple. Antes de esto, la herencia de JavaScript era posible con el objeto.Propiedad prototipo que era muy diferente y compleja en comparación con Java y C ++ y otros lenguajes de programación similares.

En esta publicación, analizaremos herencia en JavaScript usando el "extenderPalabra clave en JavaScript. Los ejemplos ayudan a comprender el concepto fuertemente, por lo que también vamos a dar ejemplos. Empecemos.

Que es la herencia?

Como cualquier otro lenguaje de programación, la herencia es un concepto muy importante en la programación orientada a objetos de JavaScript. La definición más simple de herencia es cuando los métodos y atributos de una clase padre o una clase base se copian o heredan en clases derivadas o niños. Es muy útil porque debido a esto podemos lograr la reutilización del código. La reutilización del código significa reutilizar atributos/propiedades y métodos de una clase en otra clase recién creada.

Extiende la palabra clave

Ahora que hemos visto qué herencia es. Discutamos cómo lograr esto. Como se mencionó anteriormente, solíamos lograr la herencia a través del objeto.Prototipo que se llama herencia prototípica. Sin embargo, se siguió un enfoque más fácil que estaba utilizando la palabra clave extender.

La función de extender las palabras clave se utiliza para crear una clase derivada/clase infantil de una clase principal/clase base. La clase infantil puede heredar cualquier clase y esa clase se convierte en la clase principal. Cuando heredamos, en la clase infantil todos los métodos y atributos se heredarán de la clase principal.

Sintaxis:

La clase ChildClass extiende la clase parent;

Debe tenerse en cuenta que solo funciona en la versión Ecmascript 2015 (ES6).

¿Qué navegador admite la palabra clave "extender"??

Ahora veamos qué navegadores admiten la palabra clave "extender".

Cromo	Borde	Firefox	Safari	Ópera
49.0	13.0	45.0	9.0	36.0

Ahora que hemos cubierto la teoría de la herencia y la palabra clave "extender", implementemos en JavaScript.

Ejemplo:

classAnimalName
constructor (nombre)
este.animalName = nombre;

presente()
return'name: ' + esto.nombre de animal;


classAnimalExtendSanimalName
constructor (nombre, cantidad)
super (nombre);
este.cantidad = cantidad;

que animal()
regreso.presente () + "Cantidad:" + esto.cantidad;


Const animal = nuevo animal ("pollo", 5);
alerta (animal.que animal());

En este ejemplo, tenemos una clase madre "AnimalName" donde establecemos el nombre del animal. Tiene un método con el nombre "presente ()". Tenemos otra clase "Animal" que extiende "AnimalName". Significa que la clase "animal" es una clase infantil y heredará todos los métodos de "nombre de animal". Tenemos un método en la clase "animal" con el nombre de "Whatanimal ()". En esto, estamos heredando el método de clase "AnimalName" "presente" y luego creamos una instancia de la clase "animal". Ahora, cuando alertamos a la función Whatanimal (), funcionará correctamente.

Vale la pena señalar que usamos la palabra clave super () para referirnos a la clase principal en el ejemplo anterior. Cuando llamamos al método super (), de hecho, llamamos al constructor de clases matriz y podemos acceder a todos los métodos y propiedades de los padres gracias a la palabra clave súper.

Uso de Getter y Setter en herencia

Cuando usamos clases y herencia, es casi imposible no usar Getters y Setters. Es muy útil recuperar o actualizar las propiedades antes de devolver o configurar esas propiedades.

La palabra clave "obtener" se usa para recuperar o obtener una propiedad. La palabra clave "establecer" se usa para actualizar o establecer alguna propiedad.

Por ejemplo:

classAnimalName
constructor (nombre)
este._AnimalName = nombre;

Get getAnimalName ()
regreso._AnimalName;

set setanimalName (nam)
este._AnimalName = nam;

presente()
return'name: ' + esto._AnimalName;


classAnimalExtendSanimalName
constructor (nombre, cantidad)
super (nombre);
este.cantidad = cantidad;

que animal()
regreso.getAnimalName;


const animal = nuevo animal ("pollo", 5);
alerta (animal.que animal());

En este ejemplo, utilizamos el carácter de subrayamiento porque queríamos separar el getter/setter del atributo/propiedad real para una mejor comprensión. Este ejemplo es idéntico al anterior, con la excepción de que la clase "AnimalName" ahora tiene un Getter y Setter. Recuperamos el nombre del animal de la clase principal a través del método Get, que es "GetAnimalName".

También podemos establecer una propiedad de la misma manera agregando solo una línea más usando el código anterior.

classAnimalName
constructor (nombre)
este._AnimalName = nombre;

Get getAnimalName ()
regreso._AnimalName;

set setanimalName (nam)
este._AnimalName = nam;

presente()
return'name: ' + esto._AnimalName;


classAnimalExtendSanimalName
constructor (nombre, cantidad)
super (nombre);
este.cantidad = cantidad;

que animal()
regreso.getAnimalName;


const animal = nuevo animal ("pollo", 5);
animal.setanimalName = "vaca";
alerta (animal.que animal());

La salida ahora se actualizará a "vaca".

Conclusión

La herencia es uno de los conceptos centrales de programación orientada a objetos y la definición de herencia se puede definir como cuando los métodos y atributos de una clase padre o base se copian/heredan en una clase de niño o derivado y se pueden lograr utilizando la palabra clave extender en JavaScript.

Si lee este artículo a fondo, estoy bastante seguro de que ustedes tienen una idea de cómo usar la palabra clave extensas para acceder a los métodos y atributos de la clase principal en JavaScript. Explicamos la herencia, extendimos la palabra clave, establecemos la palabra clave, obtenga la palabra clave y qué navegador admite la palabra clave extender. La herencia prototípica, como se indica desde el principio de este artículo, es anticuada y compleja. Extender es más simple y similar a otros idiomas como Java, C ++, etc.