文章已同步至掘金：https://juejin.cn/post/6844903896440111117
欢迎访问😃，有任何问题都可留言评论哦~

你可以不劳而获

继承： 让子对象拥有父对象所有的属性和方法

发扬光大： 子对象在父对象的基础上，有自己的属性和方法

JS特点：生来继承

例如：

let s = { };
s.toString(); //为什么有toString?从__proto__获取的

let a = [1,2]
a.length,a.sort		//从__proto__获取的

JS中的六种继承方式

先说一下原型，如下：

// B是A的原型，A是B的构造函数
A.prototype = B
B.constructor = A

原型链继承

基本思想

利用原型链来实现继承，父类的一个实例作为子类的原型

具体实现

function Parent(yourname){
    this.name = yourname;
}
Parent.prototype.say = function(){
    console.log(this.name)
}

function Son(yourname){
    this.name = yourname;
}
// 让Son去继承Parent上的say方法  继承 
Son.prototype = Parent.prototype
// 修改constructor的指向
Son.prototype.constructor = Son;

let p = new Parent("Hello")
p.say();

let s = new Son("world")
s.say()

优缺点

1.优点：

简单明了
实例是子类的实例，实际上也是父类的一个实例
父类新增原型方法/原型属性，子类都能访问到

2.缺点：

所有子类的实例的原型都共享同一个超类实例的属性和方法
无法实现多继承

构造继承

基本思想

通过使用call、apply方法可以在新创建的对象上执行构造函数,用父类的构造函数来增加子类的实例

具体实现

function Parent(yourname) {
	this.name = yourname;
}
Parent.prototype.say = function () {
	console.log(this.name)
}
// 让Son去继承name属性和say方法
function Son(yourname) {
	// 继承属性
	Parent.call(this,yourname)
}
// 继承方法
Son.prototype = Parent.prototype;
Son.prototype.constructor = Son;

优缺点

1.优点：

简单明了，直接继承父类构造函数的属性和方法

2.缺点：

无法继承原型链上的属性和方法

组合继承

基本思想

利用构造继承和原型链组合

具体实现

function Parent(yourname) {
	this.name = yourname;
}
Parent.prototype.say = function () {
	console.log(this.name)
}
// 让Son去继承name属性和say方法
function Son(yourname) {
	// 继承属性
	Parent.call(this, yourname)
}
// 下面的继承使用Son和Parent都指向了同一个原型对象
// Son.prototype = Parent.prototype;
// Son.prototype.constructor = Son;

// 还可以把原型对象copy一份 让Son继承copy过来的
// Parent.prototype  循环一个对象 使用 for in
for(let i in Parent.prototype){
	Son.prototype[i] = Parent.prototype[i]
}
Son.prototype.constructor = Son;

优缺点

1.优点：

解决了构造继承和原型链继承的两个问题

2.缺点：

实际上子类上会拥有父类的两份属性，只是子类的属性覆盖了父类的属性

原型式继承

基本思想

采用原型式继承并不需要定义一个类，传入参数obj,生成一个继承obj对象的对象

具体实现

function object(o){
 function F(){}
 F.prototype = o;
 return new F();
} 


var person = {
 name: "Nicholas",
 friends: ["Shelby", "Court", "Van"]
};

var anotherPerson = object(person);
anotherPerson.name = "Greg";
anotherPerson.friends.push("Rob");

var yetAnotherPerson = object(person);
yetAnotherPerson.name = "Linda";
yetAnotherPerson.friends.push("Barbie");

alert(person.friends); //"Shelby,Court,Van,Rob,Barbie"

优缺点

1.优点：

直接通过对象生成一个继承该对象的对象

2.缺点：

不是类式继承，而是原型式基础，缺少了类的概念

寄生式继承

基本思想

创建一个仅仅用于封装继承过程的函数，然后在内部以某种方式增强对象，最后返回对象

具体实现

function objectCreate(obj){
  function F(){}
  F.prototype = obj
  return new F()
}
function createAnother(original) {
	var clone = object(original);
	clone.sayHi = function() {
		alert("hi");
	};
	return clone;
}

优缺点

1.优点：

原型式继承的一种拓展

2.缺点：

依旧没有类的概念

寄生组合式继承

基本思想

结合寄生式继承和组合式继承，完美实现不带两份超类属性的继承方式

具体实现

function object(o) {
	function F(){}
	F.prototype = o;
	return new F();
}

function inheritPrototype(superType, subType) {
	var prototype = object(superType.prototype);
	prototype.constructor = subType;
	subType.prototype = prototype;
}

function SuperType(name) {
	this.name = name;
	this.colors = ["red", "blue", "green"];
}

SuperType.prototype.sayName = function() {
	alert(this.name);
};

function SubType(name, age) {
	SuperType.call(this, name);
	this.age = age;
}

inheritPrototype(SuperType, SubType);	// 这一句，替代了组合继承中的SubType.prototype = new SuperType()

SubType.prototype.sayAge = function() {
	alert(this.age);
};

优缺点

1.优点：

完美实现继承，解决了组合式继承带两份属性的问题

2.缺点：

过于繁琐，故不如组合继承

PayPal	https://paypal.me/junyangfan
BTC (Bitcoin)	3PQAbWdvH1yMSUV1SDkwpjcNW1UaDWs3Jt
USDT (TRC20)	TNVHbWeDcXZ5vXHPt9svePPKs5zZLzX4PS

PayPal	https://paypal.me/junyangfan
BTC (Bitcoin)	3PQAbWdvH1yMSUV1SDkwpjcNW1UaDWs3Jt
USDT (TRC20)	TNVHbWeDcXZ5vXHPt9svePPKs5zZLzX4PS

目录CONTENT

JS实现继承的六种方式

JS中的六种继承方式

原型链继承

构造继承

组合继承

原型式继承

寄生式继承

寄生组合式继承

^_<

评论区