美文网首页
前端笔记七(js多重继承方式)

前端笔记七(js多重继承方式)

作者: 沐雨芝录 | 来源:发表于2019-03-14 16:04 被阅读0次

    一、call/apply结合寄生多重继承实现。

      function Parent1(name){
        this.name = name;
      }
      Parent1.prototype.say = function(){
        console.log(this.name)
      }
      Parent1.prototype.sayTwo = function(){
        console.log('加油')
      }
    
      function Parent2(age){
        this.age = age;
      }
      Parent2.prototype.walk = function(){
        console.log(this.age)
      }
    
      function Child(name, age, address){
        Parent1.call(this,name);
        Parent2.call(this,age);
        this.address = address;
      }
    
      function getPrototypes (prototypes) {
        for(var i in prototypes){
          var F = function () {};
          F.prototype = prototypes[i];
          Child.prototype[i] = new F();
        }
      }
    
      getPrototypes(Parent1.prototype)
      getPrototypes(Parent2.prototype)
    
      var c1 = new Child('小米',18,'火星');
      console.log(c1)
    

    ps:其实不难理解,不明白的可以先去看我的前端笔记四(js继承的方式:精选篇),搞明白继承 是怎么回事,就很简单了。这里面主要代码就是

     Parent1.call(this,name);
     Parent2.call(this,age);
    
     function getPrototypes (prototypes) {}
    

    思想就是把两个父亲方法都拿到方式实现C继承B,B继承A。


    二、es6 class实现(Mixin思维)。

    class Parent1 {
      say() {
        console.log('我是Parent1');
      }
    }
    
    let Parent1Mixin = (extendsClass) => class extends extendsClass {
      First() {
        console.log('First');
      }
    };
    let Parent2Mixin = (extendsClass) => class extends extendsClass {
      Second() {
        console.log('Second');
      }
    };
    
    class Child extends Parent2Mixin(Parent1) {
      say () {
        console.log('Child')
        if (super.say) super.say();
      }
    }
    
    let c = new Child();
    console.log(c)
    

    到底super有啥用:

    1. 在普通函数(相当于es5的prototype函数)里,使用 super.method(...) 调用父方法。
    2. 在 constructor 函数,使用 super(...) 调用父构造函数。

    相关文章

      网友评论

          本文标题:前端笔记七(js多重继承方式)

          本文链接:https://www.haomeiwen.com/subject/lcfcmqtx.html