/*1、原型链继承*/
function SuperType() {
this.property = true;
}
SuperType.prototype.getSuperValue = function() {
return this.property;
};
function subType() {
this.subProperty = false;
}
//继承了SuperType
Subtype.prototype = new SuperType();
SubType.prototype.getSubValue = function() {
return this.subProperty;
}; var instance = new subType();
alert(instance.getSuperValue()); //true
/*
问题:包含引用类型值的原型属性会被所有实例属性共享。
原型链实现继承时,原型实际上是另一个类型的实例,
所以原先的实例属性变成了现在的原型属性。
*/
/*2、借用构造函数*/
function SuperType() {
this.colors = {"red", "blue", "green"};
}
function SubType() {
SuperType.call(this); //调用SuperType构造函数对SubType对象初始化,每个SubType实例都有SuperType所有属性和方法
} var instance1 = new SubType();
instance1.colors.push("black");
alert(instance1.colors); //"red,blue,green,black"
var instance2 = new SubType();
alert(instance2.colors); //"red,blue,green"
/*
问题:方法都在构造函数中定义,无复用性;超类型在原型中定义的方法对子类型不可见
*/
/*3、组合继承(原型链+借用构造函数)*/
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.constructor = Subtype;
Subtype.prototype.sayAge = function() {
alert(this.age);
} var instance1 = new SubType("zcj",21);
instance1.colors.push("black"); //"red,blue,green,black"
instance1.sayName(); //"zcj"
instance1.sayAge(); // var instance2 = new SubType("Garg",27);
alert(instance2.colors); //"red,blue,green"
instance1.sayName(); //"Garg"
instance1.sayAge(); //
/*
说明:避免了原型链和借用构造函数的缺陷,融合了其优点,最常用的继承模式
*/
/*4、原型式继承*/
var person = {
name:"Nicholas",
friends:["Shelby","Court","Van"]
}; var anotherPerson = Object.creat("person");
anotherPerson.name = "Greg";
anotherPerson.friends.push("Rob"); var yetAnotherPerson = Object.creat("person");
anotherPerson.name = "Linda";
anotherPerson.friends.push("Barbie"); alert(person.friends); //"Shelby,Court,Van,Rob,Barbie"
/*
说明:利用Object.create()方法,将一个对象赋给新对象的原型并返回新对象,包含引用类型值的属性会共享相应的值(如原型模式一样)
*/
/*5、寄生式继承*/
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(); //"hi"
/*思路与工厂模式和寄生构造函数类似,能够返回新对象的函数(如object())接收一个对象作为参数.使用此方法由于不能做到函数的复用性而是效率降低(与构造函数模式类似)
*/
/*6、寄生组合式继承*/
function inheritPrototype(subtype,supertype) {
var prototype = supertype.prototype; //创建对象
prototype.constructor = subtype; //增强对象
subtype.prototype = prototype; //指定对象
}
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;
}
inheritPrototype(SubType,SuperType); /*继承原型函数,得到超类型副本*/
SubType.prototype.sayAge = function() {
alert(this.age);
}
var instance = new SubType("zcj", 21); /*只在这里调用了SuperType构造函数,在新对象上创建name和colors属性*/ /*
说明:相对于组合式继承效率更高。只调用了一次SuperType构造函数,避免了在subType.prototype上创建不必要的属性
*/

javascript实现继承的6种方式的更多相关文章

  1. javascript实现继承的几种方式

    原型链方式实现继承 function SuperType(){ this.property = true; this.colors = ['red','blue','green']; } SuperT ...

  2. 实现JavaScript中继承的三种方式

    在JavaScript中,继承可以通过三种手法实现原型链继承 使用apply.call方法 对象实例间的继承.     一.原型链继承 在原型链继承方面,JavaScript与java.c#等语言类似 ...

  3. javascript实现继承的三种方式

    一.原型链继承  function Parent(){} function Child(){} Child.prototype = new Parent(); 通过对象child的prototype属 ...

  4. JavaScript——实现继承的几种方式

    实现继承的6中方法: 借用构造函数 组合继承 原型式继承 寄生式继承 寄生组合式继承 拷贝继承 1. 借用构造函数 在子类型构造函数的内部调用超类构造函数.通过使用apply()和call()方法在新 ...

  5. javascript实现继承的一种方式

    function extend(Child, Parent) { var F = function(){}; F.prototype = Parent.prototype; Child.prototy ...

  6. javascript中实现继承的几种方式

    javascript中实现继承的几种方式 1.借用构造函数实现继承 function Parent1(){ this.name = "parent1" } function Chi ...

  7. javascript(js)创建对象的模式与继承的几种方式

    1.js创建对象的几种方式 工厂模式 为什么会产生工厂模式,原因是使用同一个接口创建很多对象,会产生大量的重复代码,为了解决这个问题,产生了工厂模式. function createPerson(na ...

  8. 前端知识体系:JavaScript基础-原型和原型链-实现继承的几种方式以及他们的优缺点

    实现继承的几种方式以及他们的优缺点(参考文档1.参考文档2.参考文档3) 要搞懂JS继承,我们首先要理解原型链:每一个实例对象都有一个__proto__属性(隐式原型),在js内部用来查找原型链:每一 ...

  9. javascript创建类的6种方式

    javascript创建类的7种方式 一 使用字面量创建 1.1 示例 var obj={}; 1.2 使用场景 比较适用于临时构建一个对象,且不关注该对象的类型,只用于临时封装一次数据,且不适合代码 ...

随机推荐

  1. [转]Unity 3D旋转矢量方向及二维平面基于一点选择另一点(Rotate a Vector3 direction & Rotate a point about another point in 2D )

    http://specialwolf.blog.163.com/blog/static/124466832201301332432766/ ****************************** ...

  2. 【转】在Ubuntu上下载、编译和安装Android最新源代码

    原文网址:http://blog.csdn.net/luoshengyang/article/details/6559955 看完了前面说的几本书之后,对Linux Kernel和Android有一定 ...

  3. eclipse环境NDK问题汇总

    1. 配置NDK路径设置 可以在cygwin中通过vim修改,也可以在windows安装目录中修改 home\<你的用户名>\.bash_profile 文件中最后添加环境变量 NDK=/ ...

  4. 使用jQuery实现简单的拖动效果

    转自:http://www.muzilei.com/archives/136 如何实现拖动效果? 浏览DEMO 首先分析下拖动效果原理: 1.当鼠标在被拖动对象上按下鼠标(触发onmousedown事 ...

  5. MD5Helper辅助类

    DES加密和解密 public class MD5Helper { ///DES加密 ///sKey public string MD5Encrypt(string pToEncrypt, strin ...

  6. BI-SqlServer

    一.概述 SqlServer数据仓库 ETL组件 IntegrationService OLAP组件 AnalysisService 报表 ReportingService MDX(查多维数据集用的) ...

  7. [LeetCode] 42. Trapping Rain Water 解题思路

    Given n non-negative integers representing an elevation map where the width of each bar is 1, comput ...

  8. Java--创建线程及常用方法

    继承java.lang.Thread类--Thread类代表线程类  它的常用方法如下: static Thread currentThread():返回当前正在运行的线程对象的引用. static ...

  9. iOS开发之状态栏UIStatusBar图标操作

    NSArray *subIcons = [[[[UIApplication sharedApplication] valueForKeyPath:@"statusBar"] val ...

  10. Ajax页面跳转

    <script type="text/javascript" >    $(document).ready(function () {            $(&qu ...