ES6中的class

在了解class之前，先了解一下Object.defineProperty(obj, prop, descriptor);

给obj添加一个num属性，当给obj.num赋值时，调用set()函数，当取obj.num是,得到的是get()函数的返回值，默认返回undefined，obj.num=1;赋值操作，调用set()函数，然后在获取obj.num的值，虽然前面已经赋值1，但是，取得的是get()函数的返回值100.如果没有写get()函数，默认返回undefined

var obj= {}
Object.defineProperty(obj,"num",{
  set:function(newValue){
    console.log("你给obj.num赋值了，该值是" + newValue)
    },
get:function(){
    console.log("你要获取obj.num的值");
    return 100 ;
   }
});
obj.num =1 ;//你给obj.num赋值了，该值是1
console.log(obj.num)  ;  //你要获取obj.num的值
                         //100

当没有设置get()函数时，取得obj.num的值只能是undefined

var obj= {}
Object.defineProperty(obj,"num",{
  set:function(newValue){
    console.log("你给obj.num赋值了，该值是" + newValue)
    }
});
obj.num =1 ;//你给obj.num赋值了，该值是1
console.log(obj.num);// undefined

通过Object.defineProperty(obj, prop, descriptor);这种方式给对象添加的属性， 在获取该属性的值时，只和get()函数函数的返回值有关。

ES5中的继承：

function People(name,age){
	this.name = name;
	this.age = age;
}
//添加静态方法
People.getClassName = function(){
	return '执行静态方法';
}
//添加实例方法
People.prototype.sayName = function(){
	console.log(this.name)
};
Object.defineProperty(People.prototype,"info",{
	get:function(){
	    return 'name:' + this.name + 'age:' + this.age;
	   }
});
//子类
function Student(name,age,grade){
	People.call(this,name,age);
	this.grade = grade;
}
//继承静态方法
Student.__proto__ = People;

//继承prototype方法
Student.prototype = People.prototype;

//添加新的实例方法
Student.prototype.sayGrade = function(){
	console.log('Grade:' + this.grade);
}
var XiaoMing = new Student('小明',18,'三年级')
XiaoMing.sayName();//小明
XiaoMing.sayGrade();//Grade:三年级
console.log(XiaoMing.info);//小明age:18
console.log(Student.getClassName());//执行静态方法

ES6继承方式：通过extends 和super，子类继承了静态方法、实例方法、特殊的属性info。

注意：子类必须在constructor方法中首先调用super方法，否则会报错。这是因为子类没有自己的this对象，而是继承父类的this对象，然后对其进行加工。如果不调用super方法，子类就得不到this对象。

'use strict'
class People {
//	function People(name,age){
//		this.name = name;
//		this.age = age;
//  }
    constructor(name,age) { //构造函数
          this.name = name;
	  this.age = age;
    }
    
//  People.getClassName = function(){
//	    return '执行静态方法';
//  }
    static getClassName(){
	    return '执行静态方法';
    }
    
//  People.prototype.sayName = function(){
//		console.log(this.name)
//  };
    sayName() {
          console.log(this.name);
    }
    
//  Object.defineProperty(People.prototype,"info",{
//	   get:function(){
//	      return 'name:' + this.name + 'age:' + this.age;
//	   }
     get info(){
     	return 'name:' + this.name + 'age:' + this.age;
     }
}

//function Student(name,age,grade){
//	People.call(this,name,age);
//	this.grade = grade;
//}
//Student.__proto__ = People;
//Student.prototype = People.prototype;
class Student extends People{
	constructor(name,age,grade){
		super(name,age);
		this.grade = grade;
	}
	
	sayGrade(){
	    console.log('Grade:' + this.grade);
    }
}
var XiaoMing = new Student('小明',18,'三年级')
XiaoMing.sayName();//小明
XiaoMing.sayGrade();//Grade:三年级
console.log(XiaoMing.info);//小明age:18
console.log(Student.getClassName());//执行静态方法

本质就是语法糖：还是按es5的方式去理解。

var XiaoMing = new Student('小明',18,'三年级');
var xiaoHong = new Student('小红',18,'三年级');
console.log(XiaoMing.__proto__);//Student {}
console.log(xiaoHong.__proto__);//Student {}
console.log(XiaoMing.__proto__ === xiaoHong.__proto__);//true