Javascript 五十问——实现的继承多种方式

谈到继承，或者更广义上的：一个对象可使用另一个对象的属性或方法。实现起来无外乎有两种方式：
apply or call 改变this的做用域
原型继承 改变__proto__指向，添加做用域链

而JavaScript全部的继承实现，都是围绕以上两点展开的。
1.原型链继承
2.构造函数继承
3.组合继承
4.ES6 extends 继承

原型链继承

function Father(){}
function Son(){}
Son.prototype = new Father()

缺点很明显：
子类构造函数不能传递参数
子类只是拷贝父类的引用，父类的引用类型的属性会被全部的子类共享

构造函数继承

function Father(){}
function Son(){
    Father.apply(this, arguments)
}

解决了参数和引用共享问题，可是父类方法不可以共享。

组合继承

function Father(){}

function Son(){
    Father.apply(this, arguments)
}

Son.prototype = new Father()

实现了属性分离，方法共享；es5下的完美继承方案

ES6继承

咱们的主角，ES6 extends，就是对组合继承的改进。不一样的是在子类中，子类做用域和父类做用域谁先谁后的问题。

在ES5中，首先声明子类的 做用域，而后在将子类的做用域指向父类

在ES6中，是首先将子类的做用域指向父类，而后在此基础上加强子类的做用域。这也是为何在子类构造函数中必定要显示调用super（）的缘由。
参考babel转换后的代码：

var Son = function (_Father) {
  _inherits(Son, _Person);

  function Son() {
    _classCallCheck(this, Son);
    //为了方便阅读，简略了代码
    var _this = _possibleConstructorReturn(this,Father.call(this));

    _this.gender = "male";
    
    return _this;//返回的是 指向父类的做用域 _this
  }
  return Son;
}(Father);

关于更详细的ES6 Class的实现机制，能够参考个人另一篇文章：聊一聊ES6 CLASS 实现原理<>

后记

第一次在sifou上发布文章，添加了一个专题——Javascript五十问——里面会细致聊一些关于JavaScript原生和ES6的内容；算是我本身在开发过程当中的一点积累；若是哪位发现错误，但愿不吝赐教，共同进步！

参考文档

一篇文章理解JS继承 https://segmentfault.com/a/11...Javascript 红宝书阮一峰 ES6标准入门