美文网首页
js构造函数继承

js构造函数继承

作者: 希染丶 | 来源:发表于2019-07-08 18:09 被阅读0次

    1.构造函数绑定

    最简单,使用call和apply,将父对象的构造函数绑定到子对象身上

    function Animal(){
        this.species = "动物";
    }
    function cat(name,color){
        Animal.call(this,arguments);
        this.name = name;
        this.color = color;
    }
    var cat1 = new cat('大毛','红色');
    
    console.log(cat1.species)
    

    2.prototype模式

    将cat的prototype指向Animal实例,那么所有的cat对象都拥有animal的属性,任何一个prototype对象都有一个constructor属性,指向它的构造函数。如果没有"cat.prototype = new Animal();"这一行,Cat.prototype.constructor是指向cat的;加了这一行以后,cat.prototype.constructor指向Animal。

    每一个实例也有一个constructor属性,默认调用prototype对象的constructor属性。在运行"Cat.prototype = new Animal();"这一行之后,cat1.constructor也指向Animal!
    cat实例是由构造函数cat生成的,为了保证继承链的稳定,手动纠正,将constructor指回cat

    function Animal(){
        this.species = "动物";
    }
    function cat(name,color){
        this.name = name;
        this.color = color;
    }
    cat.prototype = new Animal();
    cat.prototype.constructor = cat;
    var cat1 = new cat("大毛","黄色");
    alert(cat1.species); // 动物
    
    
    如果没有将constructor手动纠正,那么
    
    cat1.prototype.constructor = Animal;
    纠正后
    cat1.prototype.constructor = cat;
    

    3.利用空对象做中介

    var F = function(){};
    F.prototype = Animal.prototype;
    cat.prototype = new F();
    cat.prototype.constructor = Cat;
    

    F是空对象,所以几乎不占内存。这时,修改cat的prototype对象,就不会影响到Animal的prototype对象。

    将上述操作进行封装

    function extend(Child, Parent) {
      var F = function(){};
      F.prototype = new Parent();
      Child.prototype = new F();
      Child.prototype.constructor = Child;
    }
    
    使用
    extend(cat,animal);
    cat继承animal属性
    

    4.拷贝继承

    原理为,将父对象所有属性拷贝进字对象实现继承。

    function extend2(child,parent){
        var p = new parent();
      var c = child.prototype;
      for (var i in p) {
        c[i] = p[i];
      }
    }
    extend2(cat, animal);
    

    相关文章

      网友评论

          本文标题:js构造函数继承

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