JavaScript组合继承的一点思考
今天看《JavaScript高级程序设计》一书中关于组合继承模式时。书上有这么一个Demo程序：
<html>
<head>
</head>
<body>
<script>
function SuperType(name){
this.name = name;
}
SuperType.prototype.sayName = function(){
alert(this.name);
};
function SubType(name, age){
SuperType.call(this, name);
this.age = age;
}
SubType.prototype = new SuperType();//SuperType.prototype;
SubType.prototype.sayAge = function(){
alert(this.age);
};
var instance1 = new SubType("Nicholas", 29);
instance1.sayName();
instance1.sayAge();
//var instance2 = new SuperType("Greg", 27);
//instance2.sayAge();
</script>
</body>
</html>当中的SubType.prototype = new SuperType()让我产生了疑问。这个语句的目的不就是要让子类型的原型指向父类型的原型实例吗？为什么不直接写出SubType.prototype = SuperType.prototype呢?
为何非要new一个出来？
细致考虑之后。我把Demo做了例如以下的改动。弄清楚了这么做的理由何在：
<html>
<head>
</head>
<body>
<script>
function SuperType(name){
this.name = name;
}
SuperType.prototype.sayName = function(){
alert(this.name);
};
function SubType(name, age){
SuperType.call(this, name);
this.age = age;
}
SubType.prototype = SuperType.prototype;
SubType.prototype.sayAge = function(){
alert(this.age);
};
var instance1 = new SubType("Nicholas", 29);
instance1.sayName();
instance1.sayAge();
var instance2 = new SuperType("Greg", 27);
instance2.sayAge();
</script>
</body>
</html>执行以后会发现instance2.sayAge弹出的提示是undefined，也就是说我们在为子类型的加入一个子类型想要持有的方法sayAge时。不小心也污染了父类型，使得父类型也相同拥有了sayAge方法。而父类型根本不具有age属性。当然就会提示这个属性undefined了，这些奇怪现象出现的原因就是直接使用了SubType.prototype = SuperType.prototype造成的。
假设你把这句换成SubType.prototype = new SuperType()的话再去调用sayAge方法就会执行出错。由于父类型这时候并没有这种方法（没有被子类型污染）。所以说使用new是很科学合理的。
JavaScript组合继承的一点思考的更多相关文章
- javascript组合继承
javascript继承有几种继承方式,现在来说说其中的组合继承. 组合继承是结合了原型链和借用构造函数这两种技术的继承方式,分别利用它们的长处,避免了短处.那就先说说这两种技术吧. 原型链 原型链 ...
- JavaScript ----------- 组合继承
继承 实现继承:继承实际的方法.ECMAScript 只支持实现继承,而且其实现基础主要是依靠原型链来实现的. 基本思想是:利用原型来实现一个引用类型继承另外一个引用类型的属性和方法. 原型 - 构造 ...
- Javascript 组合继承 原型链继承 寄生继承
Javascript继承通常有三种方式. 第一种:组合式继承: function SuperType(name) { this.name = name; this.colors = ["re ...
- 三张图搞懂JavaScript的原型对象与原型链 / js继承，各种继承的优缺点（原型链继承，组合继承，寄生组合继承）
摘自:https://www.cnblogs.com/shuiyi/p/5305435.html 对于新人来说,JavaScript的原型是一个很让人头疼的事情,一来prototype容易与__pro ...
- JavaScript各种继承方式（六）：寄生组合继承
一 原理 用寄生继承来改造组合继承. function Fruit(name){ this.name = name; } Fruit.prototype.eat = function(){ conso ...
- JavaScript各种继承方式（三）：组合继承（combination inheritance）
一 原理 组合继承仅仅是同时使用了原型链继承和构造函数继承. 具体做法是,将父类的实例作为子类的构造函数的原型对象,并在子类的构造函数中调用父类的构造函数. function Fruit(name){ ...
- 深入浅出javascript（十二）继承——构造函数继承和组合继承
#题记: 有一水果类,抽象出属性包括:name(水果品种),price(价格),id(ID号).现有两个子类,分别为苹果,桔子,希望继承水果父类. 一.构造函数继承 构造函数继承相当把父类的属性在子类 ...
- javascript学习笔记--经典继承、组合继承、原型式继承、寄生继承以及寄生组合继承
经典继承 js中实现经典继承的方式是通过构造函数来实现的,即在子类中对父类调用call方法. function Geometric() { this.time = ""; this ...
- JS继承之借用构造函数继承和组合继承
根据少一点套路,多一点真诚这个原则,继续学习. 借用构造函数继承 在解决原型中包含引用类型值所带来问题的过程中,开发人员开始使用一种叫做借用构造函数(constructor stealing)的技术( ...
随机推荐
- Asp.net MVC流程简述
先上个图 步骤一 IIS 当请求到达我们的服务器时,在asp.net取得控制之前,windows操作系统的核心组件 HTTP.SYS一直在监听请求端口, 接下来asp.net会通知所有注册的ht ...
- 【学习笔记】--- 老男孩学Python，day18 面向对象------抽象类(接口类), 多态, 封装
抽象类,接口类 Python没有接口这个概念 抽象类(接口类): 目的是制定一个规范 要学会归一化设计,有重复的东西就要想把它们合并起来 from abc import ABCMeta, abstra ...
- Multipath多路径冗余
一.什么是multipath 多路径冗余I/O(Multipath I/O)是指服务器通过多条物理路径连接到块存储设备. 为了避免存储链路单点故障,保证在磁盘阵列控制器切换时数据访问的不间断,多链路负 ...
- 洛谷P4783 【模板】矩阵求逆(高斯消元)
题意 题目链接 Sol 首先在原矩阵的右侧放一个单位矩阵 对左侧的矩阵高斯消元 右侧的矩阵即为逆矩阵 // luogu-judger-enable-o2 #include<bits/stdc++ ...
- 了解RabbitMQ
消息队列可以实现流量削峰.降低系统耦合度.提高系统性能等. RabbitMQ是一个实现了AMQP协议(Advanced Message Queue Protocol)的消息队列. RabbitMQ中的 ...
- C# try catch嵌套
try catch嵌套之后出现异常执行顺序: static void Main(string[] args) { try { Console.WriteLine("------------- ...
- HTML 5 <input> placeholder 属性 实现搜索框提示文字点击输入后消失
H5之前要实现这个功能还要用到JS,H5出来之后新增加了placeholder属性,有了这个属性就就能轻松实现这个功能. 定义和用法 placeholder 属性提供可描述输入字段预期值的提示信息(h ...
- for循环内嵌套finally使用的意外获得
在for循环中有continue和break,无论执行continue还是break finally的逻辑都会执行,原本以为是不执行的 格式 for (int i = 0; i < 3; i ...
- 启用优酷html5播放器的办法
方法就是在浏览器中设置下sessionStorage window.sessionStorage.setItem("P_l_h5", true);
- 《图解HTTP》总结 - 思维导图版
对具体内容感兴趣的,可以去 http://www.51test.space/archives/2830 免费下载<图解HTTP>.