继承的多种形式

97 阅读1分钟

原型链/继承实例化对象的方式

`function Car(){
            this.color = '白色'
            this.price = '100w'
        }
        function Bmw(){}`

        Bmw.prototype = new Car();
        Bmw.prototype.constructor = Bmw;

        let b1 = new Bmw();
        console.log(b1.color);
        console.log(b1.price);
        console.log(b1);
    !!会导致被赋值对象的constructor(构造器丢失)
复制代码

原型链/直接继承的方式

 function Car(){    }
      Car.prototype.color = '白色'
      Car.prototype.price = '100w'
      function Bmw(){
          this.print = function (){
              document.write(`${this.color}--${this.price}`);
          }
      }

      Bmw.prototype = Car.prototype;
      let b1 = new Bmw();
      b1.print();
      console.log(b1);
 !!造成污染 儿子的prototype改动也会导致父亲改动
复制代码

利用空对象作为中介

  ````
   function Car(){
        
    }
    Car.prototype.color='白色'
    Car.prototype.price='100w'
    function Fn(){}
    Fn.prototype=Car.prototype
    function Bmw(){
        
    }
   Bmw.prototype=new Fn()
   Bmw.prototype.constructor=Bmw
    let b1 = new Bmw();
    console.log(b1.color);
    console.log(b1);
    ````
复制代码

拷贝继承

function Person(){}
            Person.prototype.head =1;
            Person.prototype.foot =2;
            Person.prototype.eat = function(){
                document.write('我会吃饭')
            };
            function Student(){}
                for(let key in Person.prototype){
                    Student.prototype[key]=Person.prototype[key]

                }
            let stu1=new Student()
            stu1.eat() 
            封装后
            function Person(){}
            Person.prototype.head =1;
            Person.prototype.foot =2;
            Person.prototype.eat = function(){
                document.write('我会吃饭')
            };
            function Son(){ }
            function fn(a,b){
                for(var i in b.prototype ){
                    a.prototype[i]=b.prototype[i]
                }
            }
            fn(Son,Person)
           let aaa=new Son()
           console.log(aaa.head)
复制代码

组合继承

         function Car(){
        this.lunzi = 4;
      }
      Car.prototype.run = function (){
          document.write(`
              ${this.name} 我有${this.lunzi}个轮子 会跑赛道
          `);
      }
      function Bc(name){
          Car.call(this)
          this.name = name;
      }
      Bc.prototype = new Car();
      Bc.prototype.constructor = Bc;

      let bc1 = new Bc('奔驰')
      console.log(bc1);
      bc1.run();    
复制代码

构造函数方式继承

 function Car(gang,bsx){
           this.lunzi = 4;
           this.gang = gang;
           this.bsx = bsx;
       }
       function Bc(name,price,gang,bsx){
        Car.apply(this,[gang,bsx])
           this.name = name;
           this.price = price;
           this.print = function (){
                document.write(`
                    ${this.name}--${this.price}--${this.lunzi}个轮子--${this.gang}--${this.bsx}
                `);
           }
       }
       let bc1 = new Bc('奔驰E300','55W','4缸','9AT变速箱');
       bc1.print();
       console.log(bc1);