新手入門 js中的七種繼承方式

繼承本質上來說，就是去使用其他對象的屬性和方法，從而達到代碼的重用性。js中中可沒有面向對象中的那個 繼承的概念，我們所看到的都是通過其他的方式模擬器出來
類名首字母都是大寫的哦
1.原型鏈方式繼承

function SuperClass(){
			
}
SuperClass.prototype.name="zhangsan";
function SubClass(){
	
}
SubClass.prototype=new SuperClass();
var a=new SubClass();
console.log(a.name);  // zhangsan

缺點：實例化的時候 不能傳慘
2.構造函數式繼承 (對象冒充)

function SuperClass(){
	this.name="zhangsan";
}
function SubClass(){
	SuperClass.call(this);
}
var a=new SubClass();
console.log(a.name)； // zhangsan

缺點 ： 實例化對象不能獲取到 父類的 原型對象中的方法

3.組合式繼承

function SuperClass(){
}
SuperClass.prototype.name="zhangsan";
function SubClass(){
	SuperClass.call(this);
}
SubClass.prototype=new SuperClass();
var a=new SubClass();
console.log(a.name); // zhangsan

缺點 ： 每次實例化 父類中都要執行兩次 影響性能

4.原型式繼承

function inherit(o){
	function F(){}
	F.prototype=o;
	
	return new F();
}
var obj={   // 別忘了哈 定義對象的還有一種方式就是 對象字面量 這個也是一種方式
	name:"zhangsan"
}
var a=inherit(obj)
console.log(a.name); // zhangsan
// 當然也可以
function SuperClass(){
	this.name="zhangsan";
}
var a=inherit(new SuperClass()); // 拿到父類的實例化對象進入傳慘
console.log(a.name)

缺點：無法實現複用 添加一些新的屬性 難搞

5.寄生式繼承

function inherit(o){
	function F(){};
	F.prototype=o;
	return new F();
}
function SuperClass(){
	
}
SuperClass.prototype={
	constructor:SuperClass,
	run:function(){
		console.log('我可以跑步');
	},
	age:22
}
function jisheng(obj){
	var person=inherit(obj);
	person.name="my name isyunchong";
	return person;
}
var child=jisheng(SuperClass.prototype);
console.log(child.name);
child.run()

6.寄生組合式 繼承
主要解決 原型鏈式繼承中 兩次調用父類的 弊端

function inherit(o){
			function F(){};
			F.prototype=o;
			return new F();
		}
		function SuperClass(){
			
		}
		SuperClass.prototype={
			constructor:SuperClass,
			run:function(){
				console.log('我可以跑步');
			},
			age:22
		}
		function SubClass(){
			
		}
		function jszh(SubClass,SuperClass){
			var proto=inherit(SuperClass.prototype);
			proto.constructor=SubClass;
			SubClass.prototype=proto;
		}
		jszh(SubClass,SuperClass);
		var a=new SubClass();
		console.log(a.age);
		a.run();

7.es6 class 語法糖 通過extends 實現繼承

class SuperClass {
	constructor(name,age) {
	    this.name=name;
		this.age=age;
	}
	say(){
		console.log('我要睡覺了 各位大佬!');
	}
}
class SubClass extends SuperClass {
	constructor(name,age,sex) {
	    super(name,age);
		this.sex=sex;
	}
}
var a=new SubClass('yunchong',22,'男');
console.log(a.name,a.sex);
a.say()

好了 以上就是js中的幾種繼承方式 我也是花了 很長時間算是搞懂吧