Tabla de contenido
1. Herencia de cadenas de prototipos
6. Herencia composicional parasitaria
1. ¿Qué es la herencia?
La herencia es un concepto en la tecnología de software orientado a objetos.
Si una clase B "hereda" de otra clase A, esta B se denomina "subclase de A", y A se denomina "clase principal de B" o "A es una superclase de B".
Ventajas de la herencia:
1. La herencia permite que las subclases tengan varias propiedades y métodos de la clase principal sin tener que volver a escribir el mismo código.
2. Si bien la subcategoría hereda la categoría principal, puede redefinir algunos atributos y reescribir algunos métodos, es decir, sobrescribir los atributos y métodos originales de la categoría principal, para que pueda obtener diferentes funciones de la categoría principal.
Con respecto a la herencia, puede dar un ejemplo vívido primero
La clase de automóvil es la clase principal, y los camiones y automóviles son las subclases que heredan algunas propiedades y métodos de la clase de automóvil. También pueden reescribir las propiedades y métodos de la clase principal, y también pueden agregar algunas propiedades y métodos únicos de su clase. propio.
// 汽车父类
class Car {
constructor(color, type) {
this.color = color;
this.type = type;
}
getColor() {
return this.color;
}
}
// 货车子类
class Truck extends Car {
constructor(color, speed, container) {
super(color, name);
this.container = container;
}
getColor() {
return `货车的颜色为` + super.getColor();
}
}
// Suv子类
class Suv extends Car {
constructor(color, speed, quick) {
super(color, name);
this.quick = quick;
}
getColor() {
return `Suv的颜色为` + super.getColor();
}
}
let truck1 = new Truck('red', 200, 300);
console.log(truck1.getColor()); // 货车的颜色为red
let suv1 = new Suv('green', 200, 300);
console.log(suv1.getColor()); // Suv的颜色为redA partir de este ejemplo, la relación de herencia entre automóviles, camiones y todoterrenos se puede explicar en detalle.
Dos formas de herencia
1. Herencia de cadenas de prototipos
La herencia en cadena de prototipos es uno de los métodos de herencia más comunes.Existe una cierta relación entre los constructores, los prototipos y las instancias involucradas, es decir, cada constructor tiene un objeto prototipo, y el objeto prototipo contiene un puntero al constructor. función, mientras que una instancia contiene un puntero a un objeto prototipo
function Parent() {
this.name = 'parent';
this.friends = ['zs', 'lisi', 'wangwu '];
}
function Child() {
this.type = 'child';
}
Child.prototype = new Parent();
let child1 = new Child();
let child2 = new Child();
child1.friends.push('sunqi');
console.log(child1.friends, child2.friends);
console.log(child1.__proto__);La siguiente figura es el diagrama de relación prototipo del ejemplo anterior, podemos saber que Child.prototype ejecuta el objeto de instancia padre padre 1. Al cambiar el valor de los amigos del objeto hijo 1, el objeto de instancia hijo 1 en sí no tiene este atributo, por lo que buscará hacia arriba y encontrará el objeto de instancia parent1, mientras que child1 y child2 apuntan al mismo objeto de instancia parent1 , el espacio de memoria se comparte
Cuando el valor de envío se agrega a parent1.friends, el valor en el objeto de prototipo público parent1 se modifica directamente.
La impresión es la siguiente
2. Herencia de constructores
Llamada prestada para llamar a la función principal , simplemente llamando al constructor principal para construir el objeto, no se da cuenta de la herencia del prototipo real, solo puede construir las propiedades y métodos de la instancia principal y no puede acceder a las propiedades y métodos en el prototipo
Las propiedades de referencia de la clase principal no se compartirán, lo que optimiza las desventajas del primer método de herencia , pero solo puede heredar las propiedades y métodos de instancia de la clase principal, y no puede heredar propiedades o métodos prototipo
<script>
function Parent() {
this.name = 'parent';
}
Parent.prototype.getName = function () {
return this.name;
};
function Child() {
Parent.call(this);
this.type = 'child';
}
let child = new Child();
console.log(child);
console.log(child.name);
console.log(child.getName());
</script>3. Herencia de composición
La herencia de composición es una combinación de los dos métodos anteriores.
el código se muestra a continuación:
<script>
function Parent() {
this.name = 'parent';
this.friends = ['zs', 'lisi', 'wangwu '];
}
// 为Parent原型对象上添加方法
Parent.prototype.getName = function () {
return this.name;
};
function Child() {
Parent.call(this);
this.type = 'child';
}
Child.prototype = new Parent();
// 手动挂载构造器
Child.prototype.constructor = Child;
let child1 = new Child();
let child2 = new Child();
child1.friends.push('sunqi');
console.log(child1.friends, child2.friends); // 不互相影响
console.log(child1.getName());
console.log(child2.getName());
</script>La herencia combinada combina las ventajas de los dos métodos de herencia anteriores . Al instanciar Child, se llama al constructor de la clase padre. child1 y child2 son independientes entre sí y tienen sus propios valores, por lo que no se afectan entre sí. Cuando getName El método se llama En ese momento, no existía tal método en los métodos child1 y child2, y busqué hacia arriba para encontrar el método getName en el objeto prototipo de Parent.
Los resultados de la impresión son los siguientes:
4. Herencia de prototipos
Usando el método Object.create() para realizar la herencia de objetos ordinarios
Object.create(proto, [propertiesObject])
Este método crea un nuevo objeto y especifica el objeto prototipo del objeto ------- proto
<script>
let parent = {
name: 'parent',
friends: ['zs', 'lisi', 'wangwu'],
getName() {
return this.name;
},
};
// 相当于 child.__proto__ == parent
let child1 = Object.create(parent);
console.log(child1.__proto__ == parent); // true
// 为 child1 添加属性name
child1.name = 'child1';
child1.friends.push('sunqi');
let child2 = Object.create(parent);
child2.friends.push('child2');
console.log(child1);
console.log(child2);
console.log(child1.name == child1.getName()); //true
console.log(child1.friends); // ['zs', 'lisi', 'wangwu', 'sunqi', 'child2']
console.log(child2.friends); // ['zs', 'lisi', 'wangwu', 'sunqi', 'child2']
</script>Los resultados de la impresión de salida son los siguientes:
Tanto child1 como child2 no tienen su propio atributo de amigo, por lo que deben buscar y encontrar el método amigo en el objeto principal, apuntando a la misma memoria, porque el método implementa una copia superficial y Object.createlos atributos de tipo de referencia de múltiples instancias. apuntan a la misma memoria, existe la posibilidad de manipulación
5. Herencia parasitaria
La herencia parasitaria se optimiza sobre la base de la herencia anterior, y la capacidad de esta copia superficial se utiliza para mejorar y agregar algunos métodos.
<script>
let parent = {
name: 'parent',
friends: ['zs', 'lisi', 'wangwu'],
getName() {
return this.name;
},
};
// 定义继承的方法,
function clone(proto) {
let clone = Object.create(proto);
// 添加自己的方法
clone.getFriends = function () {
return this.friends;
};
return clone;
}
let child = clone(parent);
console.log(child.getName()); // parent
console.log(child.getFriends()); // ['zs', 'lisi', 'wangwu']
</script>6. Herencia composicional parasitaria
Combinación y el quinto método parasitario y el tercer método combinado
<script>
function clone(parent, child) {
// 这里改用 Object.create 就可以减少组合继承中多进行一次构造的过程
child.prototype = Object.create(parent.prototype);
child.prototype.constructor = child;
}
function Parent() {
this.name = 'parent';
this.play = [1, 2, 3];
}
Parent.prototype.getName = function () {
return this.name;
};
function Child() {
Parent.call(this);
this.friends = 'child';
}
clone(Parent, Child);
Child.prototype.getFriends = function () {
return this.friends;
};
let child = new Child();
console.log(child); //{friends:"child",name:"parent",play:[1,2,3],__proto__:Parent}
console.log(child.getName()); // parent
console.log(child.getFriends()); // child
</script>Diagrama esquemático de herencia de cadena de prototipo
A través de este método, encontramos que el objeto secundario instanciado por Child puede instanciar sus propias propiedades y métodos, y también puede heredar las propiedades y métodos del objeto prototipo.
3. Resumen
se puede resumir con una imagen
Los desarrolladores creen que la herencia compositiva parasitaria es la forma más ideal de herencia
Bienvenidos a todos a discutir en el área de comentarios y aprender juntos