JS的继承方式_function定义一个人类-CSDN博客

本文链接：https://blog.csdn.net/qq_45970651/article/details/107785209

js继承的6种方式

想要继承，就必须要提供个父类

// 定义一个人类
function People(name) {
  // 属性
  this.name = name;
  // 实例方法
  this.sleep = function(){
    console.log(this.name + '正在睡觉！');
  }
}
// 原型方法
People.prototype.eat = function(food) {
  console.log(this.name + '正在吃：' + food);
};

一.原型链继承

原型链实现继承的思想： 利用原型让一个引用类型继承另一个引用类型的属性和方法。

原型链的基本概念： 当一个原型对象等于另一个类型的实例，此时的原型对象将包含一个指向另一个指向另一个原型的指针。同时，另一个原型中也包含着一个指向另一个构造函数的指针。如果另一个原型是另一个类型的实例，此时实例和原型就构成了原型链

核心： 将父类的实例作为子类的原型

function Cat(){ 
}
Cat.prototype = new People();
Cat.prototype.name = 'cat';

//　Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.eat('shiwu'));
console.log(cat.sleep());
console.log(cat instanceof People); //true 
console.log(cat instanceof Cat); //true

重点： 让新实例的原型等于父类的实例。
特点： 1、实例可继承的属性有：实例的构造函数的属性，父类构造函数属性，父类原型的属性。（新实例不会继承父类实例的属性！）
缺点： 1、新实例无法向父类构造函数传参。
　　　2、继承单一。
　　　3、所有新实例都会共享父类实例的属性。（原型上的属性是共享的，一个实例修改了原型属性，另一个实例的原型属性也会被修改！）

二、构造继承

核心： 使用父类的构造函数来增强子类实例，等于是复制父类的实例属性给子类（没用到原型）

function Cat(name){
  People.call(this);
  this.name = name;
}

// Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.sleep());
console.log(cat instanceof People); // false
console.log(cat instanceof Cat); // true

重点： 用.call()和.apply()将父类构造函数引入子类函数（在子类函数中做了父类函数的自执行（复制））
特点： 1、只继承了父类构造函数的属性，没有继承父类原型的属性。
　　　 2、解决了原型链继承缺点1、2、3。
　　　 3、可以继承多个构造函数属性（call多个）。
　　　 4、在子实例中可向父实例传参。
缺点： 1、只能继承父类构造函数的属性。
　　　 2、无法实现构造函数的复用。（每次用每次都要重新调用）
　　　 3、每个新实例都有父类构造函数的副本，臃肿。

三、组合继承

function Cat(name){
  var instance = new People();
  instance.name = name;
  return instance;
}

// Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.sleep());
console.log(cat instanceof People); // true
console.log(cat instanceof Cat); // false

重点： 结合了两种模式的优点，传参和复用
特点： 1、可以继承父类原型上的属性，可以传参，可复用。
　　　 2、每个新实例引入的构造函数属性是私有的。
缺点： 调用了两次父类构造函数（耗内存），子类的构造函数会代替原型上的那个父类构造函数。

四、原型式继承

function Per_pro(name) {
    this.name = name;
}
Per_pro.prototype = new People();
var Per_pro = new Per_pro();
console.log(Per_pro.name);
console.log(Per_pro instanceof People);

重点： 用一个函数包装一个对象，然后返回这个函数的调用，这个函数就变成了个可以随意增添属性的实例或对象。object.create()就是这个原理。
特点： 类似于复制一个对象，用函数来包装。
缺点： 1、所有实例都会继承原型上的属性。
　　　 2、无法实现复用。（新实例属性都是后面添加的）

五、寄生式继承

function content(obj) {
    function F() {}
    F.prototype = obj; // 继承了传入的参数
    return new F(); // 反回函数对象
}
var sup = new People();
// 以上是原型式继承，给原型式继承再套个壳子传递参数
function SubObject(obj) {
    var sub = sleep (obj);
    sub.name = 'hyy';
    return sub;
}
var sup2 = new SubObject(sup);
// 这个函数经过声明之后就成了可增添属性的对象
console.log(typeof SubObject); // function
console.log(typeof sup2); // object
console.log(sup2.name); // hyy, 继承了sub属性

重点： 就是给原型式继承外面套了个壳子。
优点： 没有创建自定义类型，因为只是套了个壳子返回对象（这个），这个函数顺理成章就成了创建的新对象。
缺点： 没用到原型，无法复用。

六、寄生组合式继承

function Cat(name){
  People.call(this);
  this.name = name;
}
(function(){
  // 创建一个没有实例方法的类
  var Super = function(){};
  Super.prototype = People.prototype;
  //将实例作为子类的原型
  Cat.prototype = new Super();
})();

// Test Code
var cat = new Cat();
console.log(cat.name);
console.log(cat.sleep());
console.log(cat instanceof People); // true
console.log(cat instanceof Cat); //true