React （ES6）类的继承 super()方法的由来以及作用

此处类的继承讲解的是ES6的语法以及语义

ES6 的继承机制，是先创造　　父类的实例对象,　　然后再用    子类的   构造函数     修改。

因此，如果子类中      显式调用    构造方法 constructor(){} ,必须要在子类构造方法中调用 super() 方法。如果不

不调用 super 方法，子类就得不到 this 对象。

这里解释下什么是　　显示调用（自己的理解）：就是在子类中出现了　　构造方法 constructor(){}     这就是所谓的　　显示调用     ，整的奇奇怪怪的，让新手很难懂，其实也就那么回事。

接下来，直接上代码：

class Run {
  p() {
    console.log('ppp');
  }
}
class Man extends Run {
  // 显式调用构造方法 
  constructor() { }

  p() {
    alert(1)
  }

  a() {
    alert(2)
  }
}
var m = new Man();
m.p();
m.a();

可以看到，声明了两个类，Run和Man，然后在Run中写了个p方法，Man类继承Run，并显示调用了构造方法，但没有在其中写super方法，然后实例化了Man类，

尝试调用p方法，显示报错

ReferenceError: Must call super constructor in derived class before accessing 'this' or returning from derived constructor

显而易见，必须有super方法才能获得this，那么this的作用是啥呢？什么是this呢？这里稍后再说。。。。

先说下，Man类，在这个类中，有个p方法，和a方法，我加p方法的原因是为了尝试用子类的方法覆盖父类的方法，看能不能成功调用，结果是。。报错（就是上面的错误，这和Man没有p方法，然后调用Run的p方法结果是一样的，都报那个错误）

再说说这个a方法，我想着，调用父类的方法，你报错，重写父类的方法你也报错，那调用我自己类（Man）中的方法行不行呢？　　结果。。还是那个错误。

 

如何不出现那个错误呢？

1：不写构造方法

2：不继承

但是，显然这两个解决办法都行不通，因为，这违反了，面向对象的特点，重点是变的麻烦了，所以只好　　添上 　　super方法了。

super方法的作用：

一句话，获取子类this并且获取父类的this，但因为是在子类的构造方法中调用的super方法，所以，父类的this指向子类的this，即都为子类的this。

this的作用：

什么是this，this就是当前类，也可以叫做当前对象。什么是当前类？在Run类   中，this就是类Run，当你实例化Run类时，就得到Run类的对象，此时this就是当前对象。实例化对象其本质是开辟空间，得到指针，指针指向类。简单的来说，类是真实的物体，而，对象是物体的地址。而this的作用就是找到物体的地址，用this调用方法就是先利用地址找到物体，然后并使用物体中的某些功能，这就是this的作用：找到物体的地址，即，得到内存中　　指针的　　地址，并指向它。

 

有继承就记得写super方法，有了super（）就可以调用父类和子类的方法了。

什么时候有继承但不需要super方法呢？

答：不调用子类中和父类中的方法，子类只是单纯的返回个DOM树，此时该类只是个组件，可以用函数组件代替。