ES5/ES6中的类与继承对比

ES5中的类和静态方法

function Persion(name,age) {
	//构造函数里面的方法和属性
	this.name = name;
	this.age = age;
	this.getInfo = function(){
		console.log(`姓名：${this.name}---年龄：${this.age}`)
	}
}
//原型链上的属性和方法可以被多个实例共享
Persion.prototype.sex = '男';
Persion.prototype.user = function(){
	console.log(`${this.name}---${this.age}---${this.sex}`)
}
//静态方法
Persion.address=function(){
	console.log('静态方法')
}
//静态方法直接调用
Persion.address();
//实例化构造函数
var per1 = new Persion('star','24');
var per2 = new Persion('xiaohong','23');
//实例化调用
per1.getInfo();
per2.getInfo();
per1.user();
per2.user();

结果：

ES5继承

/*

*组合继承：原型链+对象冒充
*对象冒充继承：没法继承原型链上面的属性和方法，实例化子类的时候可以给父类传参
*原型链继承：可以继承构造函数里面以及原型链上面的属性和方法，但是实例化子类的时候无法给父类传参
两者相辅相成，可以实现大多数情况下的继承
*/
function Persion(name,age){
	this.name = name;
	this.age = age;
	this.getInfo = function(){
		console.log(`姓名：${this.name}---年龄：${this.age}`)
	}
}
Persion.prototype.sex = '男';
Persion.prototype.user = function(){
	console.log(`${this.name}---${this.age}---${this.sex}`)
}
function Thing(name,age){
	//对象冒充继承
	Persion.call(this,name,age)
}
//原型链继承
Thing.prototype = new Persion();
//可以给父类传值
var per1 = new Thing('star',20);
per1.getInfo();
//继承构造函数的方法与属性
per1.user();

结果：

ES6中的类和静态方法

class Persion{
constructor(name,age){ //类的构造函数，实例化的时候执行
	this.name = name;
	this.age = age;
}
getName(){
	console.log(this.name)
}
setName(name){
	this.name = name;
}
static run(){ //静态方法
	console.log('这是一个静态方法，用static标记')
}
}
Persion.address = '这是一个静态属性';
//静态方法与属性直接调用
Persion.run();
console.log(Persion.address)
//实例化
var per1 = new Persion('star','24');
per1.getName();
per1.setName('xiaohong');
per1.getName();

结果：

ES6中的继承

class Persion{
constructor(name,age){
	this.name = name;
	this.age = age;
}
getInfo(){
	console.log(`姓名：${this.name}---年龄：${this.age}`)
}
}
//通过extends继承类
class Per extends Persion{
constructor(name,age,sex){
	super(name,age); //实例化子类的时候把数据传递给父类
	this.sex = sex;
}
getSex(){
	console.log(this.sex);
}
}
var per1 = new Per('star','24','男');
//继承父类的方法
per1.getInfo();
per1.getSex();

结果：

ES6的单例模式

//模拟连接数据库，只需要连接一次就好
class DB{
	static getInstance(){ //通过静态方法实现单例模式
		if(!DB.instance){//自定义一个属性用于记录,第二次进来不再实例化
			DB.instance = new DB(); //实例化
		}
		return DB.instance;
	}
	constructor(){
		//实例化的时候触发构造函数，连接数据库
		this.connect();
	}
	connect(){
		console.log('连接数据库');
	}
	find(){
		console.log('查询数据库');
	}
}
var db1 = DB.getInstance();
var db2 = DB.getInstance();
db1.find();
db2.find();

结果：