JS 设计模式 三(继承)

什么是继承

继承是一种减少重复性代码的一种设计模式,尽量弱化对象间耦合,开闭原则的一种很好的实现。

javascript继承

由于javascript的语言特性,它的继承也被分为了3中实现方式

一、类继承

function extend(subClass, superClass) {
  var F = function () {
  };
  F.prototype = superClass.prototype;
  subClass.prototype = new F();
  subClass.prototype.constructor = subClass;

  subClass.superclass = superClass.prototype;
  if (superClass.prototype.constructor == Object.prototype.constructor) {
    superClass.prototype.constructor = superClass;
  }
}

function Person(name) {
  this.name = name;
}
Person.prototype.getName = function () {
  return this.name;
}
function Author(name, books) {
  Author.superclass.constructor.call(this, name);
  this.books = books;
}
extend(Author, Person);
Author.prototype.getBooks = function () {
  return this.books;
};
Author.prototype.getName = function () {
  var name = Author.superclass.getName.call(this);
  return name + ', Author of ' + this.getBooks().join(', ');
};

var hugo = new Author('hugo', ['Notre-Dame de Paris']);
hugo.getName();
hugo.getBooks();

这种继承方式比较适合不熟悉javascript语言原型的程序员使用。

二、原型继承

function clone(object) {
  function F() {
  }

  F.prototype = object;
  return new F;
}

var Person = {
  name: '默认值',
  getName: function () {
    return this.name;
  }
}

var Author = clone(Person);
Author.books = []; // Default value.
Author.getBooks = function() {
  return this.books;
}
hugo = clone(Author);
hugo.name = 'hugo';
hugo.books =['Notre-Dame de Paris'];
hugo.getName();
hugo.getBooks();

这种继承比较节约内存。但是理解更加复杂。起属性默认值指向父类属性。

三、掺元类

function augment(receivingClass, givingClass) {
  if(arguments[2]) { // Only give certain methods.
    for(var i = 2, len = arguments.length; i < len; i++) {
      receivingClass.prototype[arguments[i]] = givingClass.prototype[arguments[i]];
    }
  }
  else { // Give all methods.
    for(methodName in givingClass.prototype) {
      if(!receivingClass.prototype[methodName]) {
        receivingClass.prototype[methodName] = givingClass.prototype[methodName];
      }
    }
  }
}

var Mixin = function() {};
Mixin.prototype = {
  serialize: function() {
    var output = [];
    for(key in this) {
      output.push(key + ': ' + this[key]);
    }
    return output.join(', ');
  }
};

function Person(name) {
  this.name = name;
}
Person.prototype.getName = function () {
  return this.name;
}

augment(Person, Mixin,'serialize');
var hugo = new Person('hugo');
hugo.serialize();

这种继承方式是为了扩充类的一些重复函数而不重写代码,这个也是一种多继承的效果。

总结

javascript的继承大体上使用原型的方式会比较节省内存空间,不过也有一定的使用难度。不过在理解了原型以后就可以这是一种非常简化的继承方式,对于扩展也很方便。所以在使用javascript的继承前,最好可以很好的理解下原型链这个概念。

    原文作者:设计模式
    原文地址: https://segmentfault.com/a/1190000005084679
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞