《JS设计模式》笔记-继承之二

原型式继承

针对上文所述的缺点 ,JS设计模式笔记-继承之一,做了下面这种设计

这种中间过渡函数对象,本身没有获取父类的构造函数内部的属性和方法,所以减少了一部分开销。

最后,newBook.getYear()执行,// 1111证明继承到了父类的原型对象上的方法,// undefined表明没有继承到父类的构造函数内的属性,所以达到了期望的目的。

          function inheritObject(o) {
              function F() {
              }
              F.prototype = o
              return new F()
          }
          function Book() {
              this.year = '2014'
              this.list = ['语文', '数学', '英语']
          }
          Book.prototype.getYear = function () {
              console.log(1111);
              console.log(this.year);
          }
          var newBook = inheritObject(Book.prototype)

          newBook.getYear()
          // 1111
          // undefined
    

寄生式继承

寄生式继承,就是对原型继承进行二次封装,并且在二次封装过程中对继承进行了扩展

      function inheritObject(o) {
          function F () {
          }
          F.prototype = o
          return new F()
      }
      function Book() {
          this.year = '2014'
          this.list = ['语文', '数学', '英语']
      }
      Book.prototype.getTime = function () {
          console.log(111);
      }
      function createBook(obj) {
          var o = inheritObject(obj)
          o.getName = function () {
              console.log(222);
          }
          return o
      }
      var newBook = createBook(Book.prototype)
      newBook.getName() // 222
      newBook.getTime() // 111
  

寄生组合式继承

这种组合的主要好处:

  • 第一就是减少父类构造函数属性重复创建的消耗
  • 第二是完成原型链的继承
  • 第三是修复constructor的指向问题
     function inheritObject(o) {
          function F () {
          }
          F.prototype = o
          return new F()
      }
      function inheritPrototype(subClass, superClass) {
          var p = inheritObject(superClass.prototype)
          p.constructor = subClass
          subClass.prototype = p
      }
      function SuperClass(name) {
          this.name = name
          this.colors = ['red', 'blue', 'green']
      }
      SuperClass.prototype.getColor = function () {
          console.log(this.colors);
      }
      function SubClass(name) {
          SuperClass.call(this, name)
      }
      inheritPrototype(SubClass, SuperClass)

      var instance1 = new SubClass('小明')
      instance1.getColor()  //  [ "red", "blue", "green" ]
      var instance2 = new SubClass('小白')
      instance1.colors.push('porple')
      instance1.getColor()  // [ "red", "blue", "green", "porple" ]
      instance2.getColor()  // [ "red", "blue", "green" ]

随机浏览