ES6之Class类

一、Class的基本语法

1、简介

---

 

基本上，ES6的class可以看作只是一个 语法糖，它的绝大部分功能，ES5都可以做到，新的class写法只是让 对象原型 的写法更加清晰、更像面向对象编程的语法而已。

如果要生成一个对象实例，需要先定义一个构造函数，然后通过new操作符来完成。构造函数实例：

//函数名和实例化构造名相同并且大写（有助于区分构造函数和普通函数）

function Person(name,age){
     this.name = name;
     this.age = age;  
}
Person.prototype.read = function(){
   return "我的名字叫" + "this.name" + "今年" + this.age + "岁了";
}

var obj = new Person("一诺"，18);//通过构造函数创建对象，使用new
console.log(obj.read()) //结果：我的名字叫一诺今年18岁了。

 

上面代码的代码用ES6改写：

class Person{ //定义一个名为Person的类
   constructor(name,age){ //constructor是一个构造方法，用来接收参数
         this.name = name;
          this.age = age;
   }
   read(){
          return "我的名字叫" + this.name + "今年" + this.age + "岁了"
   }
}
var obj = new Person ("一诺",18)
console.log(obj.read()) //我的名字叫一诺今年18岁了

 

constructor方法是类的构造函数的默认方法，通过new 命令生成对象实例时，自动调用该方法。

class Box{
      constructor(){
            console.log("这个礼拜天气不错"); //当实例化对象时该行代码会执行
   }
}

var obj = new Box();

 

constructor方法如果没有显式定义，会隐式生成一个constructor方法。所以即使你没有添加构造函数，构造函数也是存在的。constructor方法默认返回实例对象this，但是也可以指定constructor方法返回一个全新的对象，让返回的实例对象不是该类的实例。

class Desk{
    constructor(){
       this.ss = "大千世界，无奇不有";
  }
}
class Box{
    constructor(){
       return new Desk();//没有用this,直接返回一个全新的对象
  }
}
var obj = new Box();
console.log(obj.ss) //大千世界，无奇不有

class不错在变量提升，所以需要先定义再使用。因为ES6不会把类的声明提升到代码的头部，但是ES5就不一样，ES5存在变量提升，可以先使用，然后再定义

2、静态方法
类相当于实例的原型，所有再类中定义的方法，都会被实例继承。如果再一个方法前加上static关键字，就 表示该方法不会被实例继承，而是直接通过类来调用，这就称为静态方法

 

注意，如果静态方法包含this关键字，这个this指的是类，而不是实例

          类的静态方法不可被实例所继承，却可以被子类继承

3、静态属性

4、class的继承

5、super关键字

参考地址：http://es6.ruanyifeng.com/#docs/class