JavaScript继承

1、构造函数继承

		function Animal(name) {
          this.name = name;
          this.color = ["red", "yellow", "blue"];
        }
        Animal.prototype.bar = function() {
          console.log("旺旺");
        }
        function Dogs(age) {
          Animal.call(this);
          this.age = age;
        }
        var hashiqi = new Dogs("哈士奇", 2);
        console.log(hashiqi.constructor);
        var hashiqi2 = new Dogs("哈士奇2", 2);
        hashiqi.color.push("pink");
        // hashiqi.bar();
        console.log(hashiqi);
        console.log(hashiqi.color);
        console.log(hashiqi2.color);

缺点: Dogs没法继承Animal的原型

2、原型链继承方法

		function Animal(name) {
          this.name = name;
          this.color = ["red", "yellow", "blue"];
        }
        Animal.prototype.bar = function() {
          console.log("旺旺");
        }
        function Dogs(age) {
          this.age = age;
        }
        Dogs.prototype = new Animal();
        var hashiqi = new Dogs("哈士奇", 2);
        var hashiqi2 = new Dogs("哈士奇2", 2);
        hashiqi.color.push("pink");
        hashiqi.bar();
        console.log(hashiqi);
        console.log(hashiqi.constructor);
        console.log(hashiqi.color);
        console.log(hashiqi2.color);

缺点: 实例化对象会改变父类及祖先类的对象属性，即this.color会被篡改，并且实例化对象的constructor不是Dog，而是Animal

3、构造函数加原型链组合继承方法

		function Animal(name) {
          this.name = name;
          this.color = ["red", "yellow", "blue"];
        }
        Animal.prototype.bar = function() {
          console.log("旺旺");
        }
        function Dogs(age) {
          Animal.call(this);
          this.age = age;
        }
        Dogs.prototype = new Animal();
        var hashiqi = new Dogs("哈士奇", 2);
        var hashiqi2 = new Dogs("哈士奇2", 2);
        hashiqi.color.push("pink");
        hashiqi.bar();
        console.log(hashiqi);
        console.log(hashiqi.constructor);
        console.log(hashiqi.color);
        console.log(hashiqi2.color);

缺点: 实例化对象会使Animal执行两次，并且实例化对象的constructor不是Dog，而是Animal

4、构造函数加原型链组合继承方法优化1.0版本

		function Animal(name) {
          this.name = name;
          this.color = ["red", "yellow", "blue"];
        }
        Animal.prototype.bar = function() {
          console.log("旺旺");
        }
        function Dogs(age) {
          Animal.call(this);
          this.age = age;
        }
        Dogs.prototype = Animal.prototype;
        var hashiqi = new Dogs("哈士奇", 2);
        var hashiqi2 = new Dogs("哈士奇2", 2);
        hashiqi.color.push("pink");
        hashiqi.bar();
        console.log(hashiqi);
        console.log(hashiqi.constructor);
        console.log(hashiqi.color);
        console.log(hashiqi2.color);
      }

缺点: 实例化对象的constructor不是Dog，而是Animal

5、构造函数加原型链组合继承方法优化2.0版本

function Animal(name) {
        this.name = name;
        this.color = ["red", "yellow", "blue"];
      }
      Animal.prototype.bar = function() {
        console.log("旺旺");
      }
      function Dogs(age) {
        Animal.call(this);
        this.age = age;
      }
      Dogs.prototype = Object.create(Animal.prototype);
      Dogs.prototype.constructor = Dogs;
      var hashiqi = new Dogs5("哈士奇", 2);
      var hashiqi2 = new Dogs5("哈士奇2", 2);
      hashiqi.color.push("pink");
      hashiqi.bar();
      console.log(hashiqi);
      console.log(hashiqi.constructor);
      console.log(hashiqi.color);
      console.log(hashiqi2.color);

该改进是完整版