ES6之Class类

ES5 的方式
通过构造函数生成对象实例

function StdInfo(){
  this.name = "job";
  this.age = 30;
}

StdInfo.prototype.getNames = function (){
  console.log("name："+this.name);
}
//得到一个学员信息对象
var p = new StdInfo()
p.getNames() // name：job

ES6的方式
通过Class语法糖

//定义类
class StdInfo {
  constructor(){
    this.name = "job";
    this.age = 30;
  }
  //定义在类中的方法不需要添加function
  getNames(){
    console.log("name："+this.name);
  }
}
//使用new的方式得到一个实例对象
var p = new StdInfo();
p.getNames() // name：job

1.类声明

类声明是定义类的一种方式，使用关键字class，后面跟上类名，然后就是一对大括号。把这一类需要定义的方法放在大括号中。

//定义类，加上constructor
class StdInfo {
  //使用new定义实例对象时，自动调用这个函数，传入参数
  constructor(name,age){
    this.name = name;      
    this.age = age;   
  }
   
  getNames(){
    console.log("name："+this.name);   
  }
}
//定义实例对象时，传入参数
var p = new StdInfo("job",30)

2.类表达式

类表达式是定义类的另一种形式，类似于函数表达式，把一个函数作为值赋给变量。
以把定义的类赋值给一个变量，这时候变量就为类名。class关键字之后的类名可有可无，如果存在，则只能在类内部使用。

const p = class {
  constructor(){
    this.name = "job";
    this.age = 30;
    console.log(StdInfo); //可以打印出值，是一个函数
  }
  //定义在类中的方法不需要添加function
  getNames(){
    console.log("name："+this.name);
  }
}
var p2 = new p();
p2.getNames() // name：job

// -------------------------------
// 立即执行的类  在类前要加上new。p为类的实例对象
const p = new class {
  constructor(name,age){
    console.log(name,age);
  }
}("job",30)

3. EXTENDS继承

使用extends关键字实现类之间的继承。这比在ES5中使用继承要方便很多。

//定义类父类
class Parent {
  constructor(name,age){
    this.name = name;
    this.age = age;
  }
 
  speakSometing(){
    console.log("I can speek chinese");
  }
}
//定义子类，继承父类
class Child extends Parent {
  coding(){
    console.log("coding javascript");
  }
}
 
var c = new Child();
 
//可以调用父类的方法
c.speakSometing(); // I can speek chinese

使用继承的方式，子类就拥有了父类的方法。
如果子类中有constructor构造函数，则必须使用调用super。

//定义类父类
class Parent {
  constructor(name,age){
    this.name = name;
    this.age = age;
  }
 
  speakSometing(){
    console.log("I can speek chinese");
  }
}
//定义子类，继承父类
class Child extends Parent {
  constructor(name,age){
    //不调super()，则会报错 this is not defined
 
    //必须调用super
    super(name,age);
  }
 
  coding(){
    console.log("coding javascript");
  }
}
 
var c = new Child("job",30);
 
//可以调用父类的方法
c.speakSometing(); // I can speek chinese

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

参考资料：脚本之家