百分百源码网-让建站变得如此简单! 登录 注册 签到领金币!

主页 | 如何升级VIP | TAG标签

当前位置: 主页>网站教程>JS教程> JavaScript中多种组合继承的介绍(代码示例)
分享文章到:

JavaScript中多种组合继承的介绍(代码示例)

发布时间:09/01 来源:未知 浏览: 关键词:
本篇文章给大家带来的内容是关于JavaScript中多种组合继承的介绍(代码示例),有必然的参照 价值,有需要的伴侣可以参照 一下,但愿对你有所帮忙。

1. 组合继承:又叫伪经典继承,是指将原型链和借用结构函数技术组合在一块的一种继承方式。

下面来看一个例子:

function SuperType(name) {
    this.name = name;
    this.colors = ["red", "blue", "green"];
  }
  SuperType.prototype.sayName = function() {
    alert(this.name);
  }
  function SubType(name, age) {
    SuperType.call(this, name);
    this.age = age;
  }
 
  //继承办法
  SubType.prototype = new SuperType();
  SubType.prototype.sayAge = function() {
    alert(this.age);
  }
 
  var instance1 = new SubType("Nicholas", 29);
  instance1.colors.push("black");
  alert(instance1.colors); //red,blue,green,black
  instance1.sayName(); //Nicholas
  instance1.sayAge(); //29
 
  var instance2 = new SubType("Greg", 27);
  alert(instance2.colors); //red,blue,green
  instance2.sayName(); //Greg
  instance2.sayAge(); //27

组合继承幸免了原型链和借用结构函数的缺陷,融合它们的长处。

2. 原型式继承

可以在不必预先定义结构函数的状况下实现继承,其本质是施行对给定对象的浅复制。而复制得到的副本还可以得到进一步的革新。

function object(o) {
    function F(){};
    F.prototype = o;
    return new F;
  }
 
  var person = {
   name: "Nicholas",
   friends: ["Shelby", "Court", "Van"]
  };
 
  var antherPerson = object(person);
  antherPerson.name = "Greg";
  antherPerson.friends.push("Rob");
 
  var antherPerson = object(person);
  antherPerson.name = "Linda";
  antherPerson.friends.push("Barbie");
 
  alert(person.friends); //Shelby,Court,Van,Rob,Barbie

3. 寄生式继承

与原型式继承非常类似,也是基于某个对象或某些信息创立一个对象,然后增强对象,最后返回对象。为理解决组合继承模式由于屡次调取超类型结构函数而致使的低效力问题,可以将这个模式与组合继承一起使用。

function object(o) {
    function F(){};
    F.prototype = o;
    return new F;
  }
  function createAnother(original) {
    var clone = object(original);
    clone.sayHi = function() {
      alert("Hi");
    };
    return clone;
  }
 
  var person = {
    name: "Nicholas",
    friends: ["Shelby", "Court", "Van"]
  };
 
  var anotherPerson = createAnother(person);
  anotherPerson.sayHi();

4. 寄生组合式继承

集寄生式继承和组合继承的长处与一身,是实现根本类型继承的最有效方式。

//继承原型
  function extend(subType, superType) {
    function F(){};
    F.prototype = superType.prototype;
 
    var prototype = new F;
    prototype.constructor = subType;
    subType.prototype = prototype;
  }
 
  //超类办法
  function SuperType(name) {
    this.name = name;
    this.colors = ["red", "blue", "green"];
  }
  SuperType.prototype.sayName = function() {
    return this.name;
  }
 
  //子类办法
  function SubType(name, age) {
    SuperType.call(this, name);
    this.age = age;
  }
 
  //继承超类的原型
  extend(SubType, SuperType);
 
  //子类办法
  SubType.prototype.sayAge = function() {
    return this.age;
  }
 
  var instance1 = new SubType("Shelby");
  var instance2 = new SubType("Court", 28);
 
  instance1.colors.push('black');
 
  alert(instance1.colors); //red,blue,green,black
  alert(instance2.colors); //red,blue,green
 
  alert(instance1 instanceof SubType); //true
  alert(instance1 instanceof SuperType); //true

这段例子的高效力表现在它只调取了一次SuperType结构函数,并且因此幸免了在SubType.prototype上面创立不必要的余外的属性。与此同时,原型链还能保持不变。因此,还能正常使用instanceof 和 isPrototypeOf()。开发人员遍及认为寄生组合式继承是援用类型最抱负的继承范式。

以上就是JavaScript中多种组合继承的介绍(代码示例)的具体内容,更多请关注百分百源码网其它相关文章!

打赏

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

百分百源码网 建议打赏1~10元,土豪随意,感谢您的阅读!

共有150人阅读,期待你的评论!发表评论
昵称: 网址: 验证码: 点击我更换图片
最新评论

本文标签

广告赞助

能出一分力是一分吧!

订阅获得更多模板

本文标签

广告赞助

订阅获得更多模板