/*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. wcf异常汇总

    1.确保客户端可以接收到服务端的异常 2.部署wcf出错,http错误404.3 3.无法自动调试 未能调试远程过程.这通常说明未在服务器上启用调试 WCF 托管在IIS上 4.ChannelFact ...

  2. 只要把鼠标移上Div方框,方框就自动顺时针旋转

    这是一个CSS3特效,IE下看不到效果.一个Div方框,在CSS3代码的作用下,只要把鼠标移上Div方框,方框就自动顺时针旋转.代码量不大,甚至有些简单,作为一个基础的CSS3实例,我想还是比较不错的 ...

  3. 【Android 开源】:最火的Android开源项目 第02期

    21. drag-sort-listview DragSortListView(DSLV)是Android ListView的一个扩展,支持拖拽排序和左右滑动删除功能.重写了TouchIntercep ...

  4. sqrt (x) 牛顿迭代法

    参考: 0开方 是 0 1的开方式 1 2的开方式 1.4 3.的开方=(1.4+3/1.4)/2 牛顿迭代法:学习自 http://blog.csdn.net/youwuwei2012/articl ...

  5. iw命令

    iwconfig这个老工具已不推荐使用,iw支持大多新的设备并已被加入内核 iw help                            查看帮助 iw dev wlan0 scan     ...

  6. 【转】[精华] 跟我一起写 Makefile

    陈皓 概述  —— 什么是makefile?或许很多Winodws的程序员都不知道这个东西,因为那些Windows的IDE都为你做了这个工作,但我觉得要作一个好的和professional的程序员,m ...

  7. B树,B-树,B+树,B*树

    B树 即二叉搜索树: 1.所有非叶子结点至多拥有两个儿子(Left和Right): 2.所有结点存储一个关键字: 3.非叶子结点的左指针指向小于其关键字的子树,右指针指向大于其关键字的子树: 如: B ...

  8. java实现简单的文件筛选

    package filenameFilter; import java.io.File; /* * 实现功能: * 获取指定路径下的指定格式的文件; * */ public class Test { ...

  9. 关于升级linux下apache

    1:Check whether Apache is already installed. # rpm -qa | grep -i http httpd-tools-2.2.8-3.i386 httpd ...

  10. ASP.NET MVC- VIEW Creating Custom HTML Helpers Part 2

    The goal of this tutorial is to demonstrate how you can create custom HTML Helpers     that you can ...