JavaScript继承之原型式继承、寄生式继承、寄生组合式继承用法实例详解-js教程-PHP中文网

JavaScript继承之原型式继承、寄生式继承、寄生组合式继承用法实例详解

伊谢尔伦

发布： 2017-07-25 16:01:44

原创

1209人浏览过

原型式继承

　　原型式继承的的实现方法与普通继承的实现方法不同，原型式继承并没有使用严格意义上的构造函数，而是借助原型可以基于已有的对象创建新对象，同时还不必因此创建自定义类型。具体代码如下：

function object(o) {
  function F() {}
  F.prototype = o;
  return new F();
}

登录后复制

代码示例：

/* 原型式继承 */
function object(o) {
  function F() {}
  F.prototype = o;
  return new F();
}

var person = {
  name : &#39;wuyuchang&#39;,
  friends : [&#39;wyc&#39;, &#39;Nicholas&#39;, &#39;Tim&#39;]
}

var anotherPerson = object(person);
anotherPerson.name = &#39;Greg&#39;;
anotherPerson.friends.push(&#39;Bob&#39;);

var anotherPerson2 = object(person);
anotherPerson2.name = &#39;Jack&#39;;
anotherPerson2.friends.push(&#39;Rose&#39;);

alert(person.friends);  // wyc,Nicholas,Tim,Bob,Rose

登录后复制

寄生式继承

/* 寄生式继承 */
function createAnother(original) {
  var clone = object(original);
  clone.sayHi = function() {
    alert(&#39;hi&#39;);
  }
  return clone;
}

登录后复制

使用示例：

/* 原型式继承 */
function object(o) {
  function F() {}
  F.prototype = o;
  return new F();
}
   
/* 寄生式继承 */
function createAnother(original) {
  var clone = object(original);
  clone.sayHi = function() {
    alert(&#39;hi&#39;);
  }
  return clone;
}

var person = {
  name : 'wuyuchang',
  friends : ['wyc', 'Nicholas', 'Rose']
}
var anotherPerson = createAnother(person);
anotherPerson.sayHi();

登录后复制

寄生组合式继承

　　JavaScrip中组合模式实现继承有以自己的缺点，现在我们就来解决它的缺点，实现思路是，对于构造函数继承属性，而原型链的混成形式继承方法，即不用在继承方法的时候实例化父类型的构造函数。代码如下：

function object(o) {
  function F() {}
  F.prototype = o;
  return new F();
}

/* 寄生组合式继承 */
function inheritPrototype(subType, superType) {
  var prototype = object(superType.prototype);
  prototype.constructor = subType;
  subType.prototype = prototype;
}

登录后复制

而在使用时只需要将组合模式中的“SubType.prototype = new SuperType();”这行代码替换成inheritPrototype(subType, superType);即可。寄生组合式继承的高效率体现在它只调用了一次父类型构造函数，避免了创建不必要的或多余的属性。与此同时，原型链还能保持不变，因此，还能够正常使用instanceof和isPrototypeof()。这也是目前来说最理想的继承方式了，目前也在向这种模式转型。（YUI也使用了这种模式。）

以上就是JavaScript继承之原型式继承、寄生式继承、寄生组合式继承用法实例详解的详细内容，更多请关注php中文网其它相关文章！