Class的继承

一、简介

classt通过extends关键字实现继承，es5通过修改原型链实现继承
1、es5通过修改原型链实现继承

   // 定义一个Animal 构造函数，作为Dog的父类
   function Animal (){
     this.superType = "Animal";
   }
   Animal.prototype.superSpeak = function(){
     alert （this.superType）
   }
   function Dog (name){
	   this.name = name;
	   this.type = "Dog"
   }
   //原本Dog的prototype指向Doc的原型对象->构造函数->原型对象
   //现在改变Dog的prototype指针，指向一个 Animal 实例
   Dog.prototype = new Animal(); // 通过原型链的方式，实现 Dog 继承 Animal 的所有属性和方法
   Dog.prototype.speak = function () {
	　　alert(this.type);
   }
   var doggie = new Dog('jiwawa');
   doggie.superSpeak();  //Animal 

总结：就是当重写了Dog.prototype指向的原型对象后，实例的内部指针也发生了改变，指向了新的原型对象，然后就能实现类与类之间的继承了。（但是如果在重写原型对象之前，产生的实例，其内部指针指向的还是最初的原型对象

2、es6通过extends继承

  class Point {}
  class colorPoint extends Point{
      //super表示父类的构造函数，用来新建父类的this对象
	 constructor(x, y, color) {
	         super(x, y); // 调用父类的constructor(x, y),
	         this.color = color;
	  }
	
	  toString() {
	      return this.color + ' ' + super.toString(); // 调用父类的toString()
	  }
  }

super 关键字

super：既可以当作函数处理，也可以当作对象使用
1：作为函数调用时，代表父类的构造函数，只能用在子类的构造函数之中，super虽然代表了父类A的构造函数，但是返回的是子类B的实例，即super内部的this指的是B，因此super()在这里相当于A.prototype.constructor.call(this)
2、super作为对象时，在普通方法中，指向父类的原型对象；在静态方法中，指向父类

构造函数和普通函数有什么区别

1：构造函数都应该以一个大写字母开头，非构造函数则应该以一个小写字母开头
2：调用方式：任何函数，只要通过new操作符调用，那么它就是构造函数；不使用new操作符调用，那么它就是普通函数
3：调用过程

//创建函数
function Person(name,age,job){
     this.name=name;
     this.age=age;
     this.job=job;
     this.sayName=function(){
          alert(this.name);
      }
}
 //当作构造函数使用
 var person=new Person1('Nicholas',29,'software Engineer');//this-->person
 person.sayName();//'Nicholas'
 //当作普通函数使用
 Person1('Nicholas',27,'Doctor');//this-->window
 window.sayName();//'Nicholas'

class 和普通构造函数区别

1：Class在语法上更加贴合面向对象的写法
2：Class在实现继承上更加易读、易理解
3：本质上还是语法糖，使用prototype