Class的使用，构造方法，实例属性和实例方法，静态属性和静态方法，this和super关键字，类的继承

Class的使用，构造方法，实例属性和实例方法，静态属性和静态方法，this和super关键字，类的继承

*[ 直接进入主题，尽量为大家梳理清晰一些]:

1.什么是class

ES6 提供了更接近传统语言的写法，引入了 Class（类）这个概念，作为对象的模板。通过class关键字，可以定义类。

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

2.类的简介

在es5中生成实例对象是通过构造函数。下面举一个例子：

   function Fun(a,b) {
    this.a = a;
    this.b = b;
}
Fun.prototype.showA = function () {
    console.log(this.a)
}
var fun = new Fun(1,2);
fun.showA();//1

上面的代码用 ES6 的class改写，就是下面这样:

class Fun {
    constructor(a,b){
        this.a = a;
        this.b = b;
    }
    showA() {
        console.log(this.a);
    }
}
var fun = new Fun(1,2);
fun.showA();//1

1. 上面的constructor方法，称为构造方法
2. this代表实例对象
3. ES5 的构造函数Fun，对应 ES6 的Fun类的构造方法。
4. 类必须使用new调用，否则会报错。这是它跟普通构造函数的一个主要区别，后者不用new也可以执行。
5. 这两种写法是一样的，在es6中，class可以理解为一个语法糖，只是让这种写法更加直观

3.Class 的静态属性

静态属性指的是 Class 本身的属性，而不是定义在实例对象（this）上的属性。

class MyClass {
  static myStaticProp = 42;
 
  constructor() {
    console.log(MyClass.myStaticProp); // 42
  }

上面的写法为Foo类定义了一个静态属性prop。

目前，只有这种写法可行，因为 ES6 明确规定，Class 内部只有静态方法，没有静态属性。

4.Class 的静态方法

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

class Foo {
  static classMethod() {
    return 'hello';
  }
}

Foo.classMethod() // 'hello'

var foo = new Foo();
foo.classMethod()
// TypeError: foo.classMethod is not a function

上面代码中，Foo类的classMethod方法前有static关键字，表明该方法是一个静态方法，可以直接在Foo类上调用（Foo.classMethod()），而不是在Foo类的实例上调用。如果在实例上调用静态方法，会抛出一个错误，表示不存在该方法。

5.Class 的实例属性和实例方法

声明在方法中,通过self声明的属性,是实例对象所特有的属性,而实例对象是类创建的对象，实例属性 需要实例化后 才加载 存放在堆中

实例方法也叫做对象方法。 类方法是属于整个类的,而实例方法是属于类的某个对象的

// 声明一个类
class Student{


    constructor(n) {
        console.log('构造方法被执行....');
        //实例属性
        this.name = n
    }
//实例方法
    read(i){
        console.log("student read()...."+i)
    }
}
//实例化对象
 var s1 = new Student("ask");
 s1.read(1);
console.log(s1.name);

var s2 = new Student("say");
s2.read(2);
console.log(s2.name)

6.this和super关键字

this 关键字用于引用类的当前实例
super 关键字用于从子类访问父类的变量和方法

** 使用 this 和 super 要注意的问题：**

1. 在构造器中显式使用 super() 调用父类中的其他构造方法时，该语句必须处于构造器的首行，否则编译器会报错。另外，使用 this 调用本类中的其他构造方法时，也要放在首行
2. this、super 不能用在 static 方法中

7.类的继承

Class 可以通过extends关键字实现继承，这比 ES5 的通过修改原型链实现继承，要清晰和方便很多。

class Point {
}

class ColorPoint extends Point {
}

今天确实不在状态，感觉有点懵，思路没那么清晰，梳理这些东西脑子都要炸了 —__— ；