Explicar las subclases y la herencia en ES6

Subclase: una subclase es una clase que se deriva de las propiedades y métodos de alguna otra clase conocida como clase principal para esa subclase. Una subclase nos permite cambiar o actualizar las propiedades de la clase principal sin alterarla. Una subclase puede contener propiedades de la clase principal y también podemos definir las nuevas propiedades dentro de ella.

Aquí, en la imagen de arriba, la clase GeeksforGeeks actuará como la clase principal para las clases Officials y Geeks . Las clases Officials y Geeks serán subclases y heredarán algunas propiedades y métodos de la clase principal GeeksforGeeks.

Para proporcionar propiedades de la clase principal a una subclase, usamos la herencia: la herencia es la forma de extender una clase al proporcionarle algunas propiedades y valores nuevos usando otra clase sin siquiera alterarla. La herencia se puede hacer de dos formas:

  • Herencia prototípica
  • Herencia usando la palabra clave extends

Herencia prototípica: La herencia prototípica se realiza utilizando la palabra clave prototipo . La herencia prototípica es la sintaxis de herencia es5 .

Sintaxis:

function func_name(){
    // Content of func_name()
} 

func_name.prototype.func_name2(){
    // Content of func_name2()
}

Ejemplo: El siguiente ejemplo ilustra la herencia utilizando la palabra clave prototipo .

Javascript

function GeeksforGeeks(name, desc) {
    this.name = name;
    this.desc = desc;
}
  
GeeksforGeeks.prototype.Officials = function Officials() {
    console.log("I'm an Official.");
    console.log("Community name is: ", this.name);
};
  
GeeksforGeeks.prototype.Geeks = function Geeks() {
    console.log("I'm an Geek.");
    console.log("Community description is: ", this.desc);
};
  
var GFG = new GeeksforGeeks(
    "GeeksforGeeks",
    "A computer science portal for all geeks."
);
  
GFG.Officials();
GFG.Geeks();

Producción:

Herencia usando la palabra clave extends: es6 o ECMAScript-2015 introduce el concepto de heredar las propiedades de la clase principal usando la palabra clave extends . Usaremos el método super() dentro de la subclase para invocar la función constructora de la clase principal. 

Sintaxis:

// Code for the parent class
class parent_class{
    constructor(){
        // Body of constructor
    }
}

// Code for the child or sub class
class sub_class extends parent_class{
    constructor(){
        super()  
        // Body of constructor
    }
}

Ejemplo:

Javascript

class GeeksforGeeks {
  constructor(name, desc) {
    this.name = name;
    this.desc = desc;
  }
  
  getCommunityName() {
    return this.name;
  }
  
  getCommunityDescription() {
    return this.desc;
  }
}
  
class Courses extends GeeksforGeeks {
  constructor(communityName, communityDesc,
  courseName, courseDesc) {
    super(communityName, communityDesc);
    this.c_name = courseName;
    this.c_desc = courseDesc;
  }
  
  printValues() {
  
    // You can also use 'this' keyword in place 
    // of 'super' to access properties and
    // methods of parent class
    console.log('The name of Community is: ', 
        super.getCommunityName());
    console.log('The description of Community is: ', 
        super.getCommunityDescription());
    console.log('The name of Course is: ', this.c_name);
    console.log('The description of Course is: ', this.c_desc);
  }
}
  
const GFG = new Courses(
  'GeeksforGeeks',
  'A computer science portal for all geeks.',
  'DSA - Self Paced Course',
  'A complete guide to Data Structures and Algorithms.',
);
  
GFG.printValues();

Producción:

Publicación traducida automáticamente

Artículo escrito por abhisheksainiaggarwal y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *