Class基本使用和继承

1、类的由来

1.1 下面代码定义了一个“类”，可以看到里面有一个constructor方法，这就是构造方法，而this关键字则代表实例对象。也就是说，ES5 的构造函数Point，对应 ES6 的Point类的构造方法。

Point类除了构造方法，还定义了一个toString方法。注意，定义“类”的方法的时候，前面不需要加上function这个关键字，直接把函数定义放进去了就可以了。另外，方法之间不需要逗号分隔，加了会报错。

例：

 class Point {  constructor(x, y)
  {    this.x = x;   
      this.y = y; 
       } 
  
   toString() {   
    return '(' + this.x + ', ' + this.y + ')';  
    }
   }

2.constructor方法

2.1 constructor方法是类的默认方法，通过new命令生成对象实例时，自动调用该方法。一个类必须有constructor方法，如果没有显式定义，一个空的constructor方法会被默认添加。

例：

  class Point {
  }

// 等同于
Point {  
constructor() {}
}

2.2 上面代码中，定义了一个空的类Point，JavaScript 引擎会自动为它添加一个空的constructor方法。

3.类的事例

3.1 类的实例化对象必须要写new，如果不写new ，强制调用会报错

例：

 class Point { 
 	 // ...
  }
  // 报错var point = Point(2, 3);
 // 正确var point = new Point(2, 3);

4.类的继承

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

4.2 继承就是子继承父但是父不能继承子，如果子有属于自己的东西那么就会把继承父类的东西给覆盖掉。

例：

	父：	class Point {
		      }
 
	子：	class ColorPoint extends Point {
		     }

5.super关键字

5.1 **super这个关键字，既可以当作函数使用，也可以当作对象使用。**在这两种情况下，它的用法完全不同。

5.2 第一种情况，super作为函数调用时，代表父类的构造函数。ES6 要求，子类的构造函数必须执行一次super函数。

例：

class A {}

class B extends A {
  constructor() {
    super();
  }
}

5.3 第二种情况，super作为对象时，在普通方法中，指向父类的原型对象；在静态方法中，指向父类。

例：

class A {
  p() {
    return 2;
  }
}

class B extends A {
  constructor() {
    super();
    console.log(super.p()); // 2
  }
}

let b = new B();

6.静态方法

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

例：

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

Foo.classMethod() // 'hello'

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

6.静态属性

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

class Foo {
}

Foo.prop = 1;
Foo.prop // 1

来源：CSDN

作者：-SUXFAN-

链接：https://blog.csdn.net/susu100600/article/details/103602822

标签

构造方法