理解JavaScript继承(二)
理解JavaScript继承(二)
5.寄生式继承
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();//"hi"
这个实例基于person返回了一个新对象anotherPerson。新对象不仅具有person的所有属性和方法,而且还有自己的sayHi()方法。
缺点:和构造函数一样,不能做到函数复用而降低效率。
6.寄生组合式继承
前面介绍说组合继承是JavaScript最常用的继承模式;实际上,它也存在一些问题,组合继承的最大问题是无论什么情况下,都会调用两次超类型构造函数:一次是在创建子类型原型的时候,另一次是在子类型构造函数内部。
组合式继承实例
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);//第二次调用SuperType()
this.age = age;
}
SubType.prototype = new SuperType();//第一次调用SuperType()
SubType.prototype.sayAge = function(){
alert(this.age);
};
在第一次调用SuperType()构造函数时,SubType.prototype会得到两个属性:name和colors;他们都是SuperType的实例属性,只不过现在位于SubType的原型中。当调用SubType构造函数时,又会调用一次SuperType构造函数,这一次又在新对象上创建了实例属性name和colors,于是,这两个属性就屏蔽了原型中的两个同名属性。
上面一共有两组name和colors属性:一组在实例上,一组在SubType原型中。这就是调用两次SuperType的结果。
为了解决这种情况,于是就出现了下面的——寄生组合式继承方法。
所谓寄生组合式继承,即通过借用构造函数来继承属性,通过原型链的混成形式来继承方法。其背后的基本思路是:不必为了指定子类型的原型而调用超类型的构造函数,我们所需要的无非就是超类型原型的一个副本而已。(之所以是超类型的副本,而不是直接是超类型,如果直接是超类型的话。当子类型为原型添加方法时,也会影响到超类型的)
寄生组合式继承
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; //指定对象
}
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 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
上面实例只在SuperType.call(this, name);这调用了一次构造函数,并且因此避免了在prototype上面创建不必要的,多余的属性。
注:YUI的extend()就是采用这种寄生组合式继承
理解JavaScript继承(二)的更多相关文章
- 理解JavaScript继承
原文:理解JavaScript继承 对于JavaScript的继承和原型链,虽然之前自己看了书也听了session,但还是一直觉得云里雾里,不禁感叹JavaScript真是一门神奇的语言.这次经过Sp ...
- 理解JavaScript继承(三)
理解JavaScript继承(三) 通过把父对象的属性,全部拷贝给子对象,也能实现继承. 7.浅拷贝 function extendCopy(p) { var o = {}; for (var pro ...
- 理解JavaScript继承(一)
理解JavaScript继承(一) 我们都知道,面向对象的编程语言非常强大,之所以强大,就是其支持继承.在JavaScript中,也支持继承,而且有多种方法实现继承,比如原型链继承,借用构造函数继承, ...
- 深入理解 JavaScript(二)
立即调用的函数表达式 前言 大家学 JavaScript 的时候,经常遇到自执行匿名函数的代码,今天我们主要就来想想说一下自执行. 在详细了解这个之前,我们来谈了解一下"自执行"这 ...
- javascript继承(二)—创建对象的三种模式
一.工厂模式 function createPerson(name,age){ var o = {}; o.name = name; o.age = age; o.sayHi = function() ...
- 彻底理解Javascript原型继承
彻底理解Javascript原型继承 之前写过一篇Javascript继承主题的文章,这篇文章作为一篇读书笔记,分析的不够深入. 本文试图进一步思考,争取彻底理解Javascript继承原理 实例成员 ...
- 理解Javascript的动态语言特性
原文:理解Javascript的动态语言特性 理解Javascript的动态语言特性 Javascript是一种解释性语言,而并非编译性,它不能编译成二进制文件. 理解动态执行与闭包的概念 动态执行: ...
- 深入理解javascript原型和闭包(6)——继承
为何用“继承”为标题,而不用“原型链”? 原型链如果解释清楚了很容易理解,不会与常用的java/C#产生混淆.而“继承”确实常用面向对象语言中最基本的概念,但是java中的继承与javascript中 ...
- 理解JavaScript中的原型继承(2)
两年前在我学习JavaScript的时候我就写过两篇关于原型继承的博客: 理解JavaScript中原型继承 JavaScript中的原型继承 这两篇博客讲的都是原型的使用,其中一篇还有我学习时的错误 ...
随机推荐
- 获取本地内网和外网IP地址
public class IPUtil { /// <summary> /// 获取本地内网IP /// </summary> /// <returns></ ...
- 无法正常下载Nuget 包的问题
引用Nuget 是遇到的问题,再次记录一下. 问题描述:Install-Package : 无法安装程序包“Quartz 3.0.2”.您正在尝试将此程序包安装到某个将“.NETFramework,V ...
- PHPCMS V9 fsockopen 函数被禁用解决方案
PHPCMS V9 fsockopen 禁用解决方案, 把fsockopen 替换成 pfsockopen 替换文件:phpsso_server/api/uc_client_1_5/client.ph ...
- CentOS /lib/ld-linux.so.2: bad ELF interpreter: No such file or directory
使用的时候出现一个错误 bash: /usr/local/bin/rar: /lib/ld-linux.so.2: bad ELF interpreter: No such file or direc ...
- redis 命令select、dbsize、清空数据库、info、client
select 切换库 dbsize 当前库中数据条数 清空数据库 flushdb | flushall 清空数据,一个是清空当前库,一个清空当前实例 查看服务器及redis相关信息 infoinfo ...
- windows 程序员电脑设置
程序员电脑设置: 1.详细目录 a.在一个文件夹下设为详细信息 b.win7点击"组织"-->"文件夹的搜索选项"-->"查看" ...
- CCSUOJ评测系统——第一次scrum冲刺
1.第一次冲刺任务安排 对Github上的HUSTOJ开源项目进行Fork,搭建基本环境 2.用户需求 ①基本功能显示在首页 ②能够提交题目并判题,并对自己所提交的题目正确性进行反馈,能够查看自己提交 ...
- 的确,Java存在缺陷。但是……
[编者按]本文作者为资深码农 Tim Spann,主要讲述 Java 让人无法抗拒的众多优点以及一些些缺陷.本文系国内 ITOM 管理平台 OneAPM 编译呈现,以下为正文. 早在90年代中期,笔者 ...
- LeetCode 之Find Minimum in Rotated Sorted Array
1.题目描述 2.题目分析 对该问题,要找最小元,可以从后向前遍历,只要前一个元素大于当前元素,说明当前元素就是最小元. 3.代码 int findMin(vector<int>& ...
- leetcode题解之分解字符串域名
1.题目描述 A website domain like "discuss.leetcode.com" consists of various subdomains. At the ...