Javascript 五十问——完成的继续多种体式格局

2023年1月12日 215次阅读 来源: 蔺相如如

谈到继续，或许更广义上的：一个对象能够运用别的一个对象的属性或要领。完成起来无外乎有两种体式格局：
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规范入门

    原文作者：蔺相如如
    原文地址: https://segmentfault.com/a/1190000017834614
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞