es5与es6中类和继承的区别

我们知道es6是es5的下一代标准，严格上指ECMAScript2015，广泛上指es6、es7,es8的合集，称为ECMAScript2015标准，经常说的就是广泛上的es6。本文主要讲的就是两代标准中类的实现和区别。

es5

es5中的类就是用function生成的一个方法，通过new实例化一个对象，实例化对象可以使用该方法的属性。该方法也就是一个构造函数，构造函数通过prototype指向原型对象，原型对象里存放公共方法，实例化对象可以使用公共方法。

function Person(name,age){
	this.name = name;
	this.age = age;
}
Person.prototype.sayName = function(){
	console.log('My name is '+ this.name);
}
var person = new Person('jack',12);
p.sayName();
console.log(p);
//继承 原型链继承
function Person1(name){
	this.name = name;
}
var p1 = new Person1('lerry');
p1.__proto__ = p;
p1.sayName();		//结果为My name is lerry
console.log(p1);

es5中的继承就是通过原型链继承（经典继承），通过__proto__指向父级来继承父级，子构造函数继承之后可以使用父构造函数中的属性方法，例如p1用__proto__继承p后可以使用sayName方法。

es6

es6中的类用class表示，类中有一个默认constructor方法（构造器），new对象时会自动调用，如果没有显式生成系统会自动生成一个空的constructor方法，构造器里的属性是私有属性，类中还定义实例方法和属性、静态方法和属性。使用static写静态属性和方法。

class Animal(){
	constructor(name,age){
		this.name = name;
		this.age = age;
	}
	sayName(){
		console.log('My name is ' +this.name);
	}
	//静态属性和方法，使用static关键字
	static animalAttr= '静态属性';
	static animalMethod(){
		conlose.log('这是一个静态方法');
	}
}
//继承Animal 使用extends关键字
class Dog extends Animal(){
	constructor(name,age,color){
	//继承Animal 使用super配合extends
		super(name,age);
		this.color = color;
	}
}
let dog = new Dog('lucky',3,black);
console.log(Animal.animalAttr);
Animal.animalMethod();
//下面这两行代码可以验证是否继承到了
Dog.prototype.__proto__ == Animal.prototype;			//true
dog.__proto__.__proto__ == Animal.prototype;			//true

es6中的继承是在class中使用extends关键字，在构造器内部使用super关键字配合extends形成完整的继承。es6继承中实例对象的原型可以直接访问父级的原型对象，不用通过访问父级的实例对象然后再访问父级的原型对象。注：静态的属性和方法是存放在构造函数中的需要用构造函数去继承，不能用实例对象。