javascript继承-js 继承

在JavaScript中实现继承有多种解决方案，主要通过原型链、借用构造函数、组合继承、原型式继承、寄生式继承以及寄生组合式继承等方法。这些方法各有特点，可以根据实际需求选择最合适的继承方式。

1. 原型链继承

这是最基础的继承方式。子类实例可以访问父类原型中的属性和方法。其核心是将子类的原型设置为父类的一个实例。

javascript
function Parent() {
  this.colors = ["red", "blue", "green"];
}
Parent.prototype.getColor = function() {
  return this.colors;
}</p>

<p>function Child() {}</p>

<p>// 关键步骤：创建父类实例并赋值给子类原型
Child.prototype = new Parent();
Child.prototype.constructor = Child;</p>

<p>let child1 = new Child();
console.log(child1.getColor()); // ["red", "blue", "green"]</p>

<p>// 缺点：所有子类实例共享同一个父类实例属性，如colors数组

2. 借用构造函数继承

使用call()或apply()方法，在子类构造函数中调用父类构造函数，这样可以解决原型链继承享引用类型的问题。

javascript
function Parent(name) {
  this.name = name;
  this.colors = ["red", "blue", "green"];
}</p>

<p>function Child(name, age) {
  // 在当前上下文中执行Parent构造函数
  Parent.call(this, name);
  this.age = age;
}</p>

<p>let child1 = new Child("Alice", 18);
console.log(child1.name); // Alice
console.log(child1.colors); // ["red", "blue", "green"]
console.log(child1.age); // 18</p>

<p>// 缺点：无法继承父类原型中的方法

3. 组合继承

结合原型链继承和构造函数继承的优点，是最常用的继承模式。

javascript
function Parent(name) {
  this.name = name;
  this.colors = ["red", "blue", "green"];
}</p>

<p>Parent.prototype.sayName = function() {
  console.log(this.name);
}</p>

<p>function Child(name, age) {
  Parent.call(this, name); // 第二次调用Parent()
  this.age = age;
}</p>

<p>// 次调用Parent()
Child.prototype = new Parent();
Child.prototype.constructor = Child;</p>

<p>Child.prototype.sayAge = function() {
  console.log(this.age);
}</p>

<p>let child1 = new Child("Bob", 20);
child1.sayName(); // Bob
child1.sayAge(); // 20

4. 寄生组合式继承

解决了组合继承中父类构造函数被调用两次的问题，是目前最理想的继承模式。

javascript
function inheritPrototype(child, parent) {
  let prototype = Object.create(parent.prototype); // 创建对象
  prototype.constructor = child; // 增强对象
  child.prototype = prototype; // 指定对象
}</p>

<p>function Parent(name) {
  this.name = name;
  this.colors = ["red", "blue", "green"];
}</p>

<p>Parent.prototype.sayName = function() {
  console.log(this.name);
}</p>

<p>function Child(name, age) {
  Parent.call(this, name);
  this.age = age;
}</p>

<p>inheritPrototype(Child, Parent);</p>

<p>Child.prototype.sayAge = function() {
  console.log(this.age);
}</p>

<p>let child1 = new Child("Charlie", 25);
child1.sayName(); // Charlie
child1.sayAge(); // 25

以上几种继承方式各有优缺点，在实际开发中应根据具体需求选择最适合的继承模式。通常情况下，建议使用寄生组合式继承，它既能有效继承父类实例属性，又能继承父类原型上的方法，同时避免了多次调用父类构造函数的问题。

（本文地址：https://www.nzw6.com/35529.html）