今天看《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组合继承的一点思考的更多相关文章

  1. javascript组合继承

    javascript继承有几种继承方式,现在来说说其中的组合继承. 组合继承是结合了原型链和借用构造函数这两种技术的继承方式,分别利用它们的长处,避免了短处.那就先说说这两种技术吧. 原型链  原型链 ...

  2. JavaScript ----------- 组合继承

    继承 实现继承:继承实际的方法.ECMAScript 只支持实现继承,而且其实现基础主要是依靠原型链来实现的. 基本思想是:利用原型来实现一个引用类型继承另外一个引用类型的属性和方法. 原型 - 构造 ...

  3. Javascript 组合继承 原型链继承 寄生继承

    Javascript继承通常有三种方式. 第一种:组合式继承: function SuperType(name) { this.name = name; this.colors = ["re ...

  4. 三张图搞懂JavaScript的原型对象与原型链 / js继承,各种继承的优缺点(原型链继承,组合继承,寄生组合继承)

    摘自:https://www.cnblogs.com/shuiyi/p/5305435.html 对于新人来说,JavaScript的原型是一个很让人头疼的事情,一来prototype容易与__pro ...

  5. JavaScript各种继承方式(六):寄生组合继承

    一 原理 用寄生继承来改造组合继承. function Fruit(name){ this.name = name; } Fruit.prototype.eat = function(){ conso ...

  6. JavaScript各种继承方式(三):组合继承(combination inheritance)

    一 原理 组合继承仅仅是同时使用了原型链继承和构造函数继承. 具体做法是,将父类的实例作为子类的构造函数的原型对象,并在子类的构造函数中调用父类的构造函数. function Fruit(name){ ...

  7. 深入浅出javascript(十二)继承——构造函数继承和组合继承

    #题记: 有一水果类,抽象出属性包括:name(水果品种),price(价格),id(ID号).现有两个子类,分别为苹果,桔子,希望继承水果父类. 一.构造函数继承 构造函数继承相当把父类的属性在子类 ...

  8. javascript学习笔记--经典继承、组合继承、原型式继承、寄生继承以及寄生组合继承

    经典继承 js中实现经典继承的方式是通过构造函数来实现的,即在子类中对父类调用call方法. function Geometric() { this.time = ""; this ...

  9. JS继承之借用构造函数继承和组合继承

    根据少一点套路,多一点真诚这个原则,继续学习. 借用构造函数继承 在解决原型中包含引用类型值所带来问题的过程中,开发人员开始使用一种叫做借用构造函数(constructor stealing)的技术( ...

随机推荐

  1. 山东第四届省赛: Boring Counting 线段树

    http://acm.sdibt.edu.cn/JudgeOnline/problem.php?id=3237 Problem H:Boring Counting Time Limit: 3 Sec  ...

  2. hdu Square DFS

    Square Time Limit: 10000/5000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Sub ...

  3. MangoDB的C#驱动库(.net framewokr 4.0)

    编写运维工具,需要联接MangoDB 基于我陈旧的技术栈,就用c#开发了 驱动库下载地址记录到至此,需要的可以下载 注意,此驱动是老版本的,只支持.net framewokr 4.0 看了半天,觉得够 ...

  4. 进程间通信IPC -- 管道, 队列

    进程间通信--IPC(Inter-Process Communication) 管道 from multiprocessing import Pipecon1,con2 = Pipe()管道是不安全的 ...

  5. 高级功能:很有用的javascript自定义事件

    之前写了篇文章<原生javascript实现类似jquery on方法的行为监听>比较浅显,能够简单的使用场景. 这里的自定义事件指的是区别javascript默认的与DOM交互的事件,比 ...

  6. angr 学习笔记

    前言 angr 是一个基于 符号执行 和 模拟执行 的二进制框架,可以用在很多的场景,比如逆向分析,漏洞挖掘等.本文对他的学习做一个总结. 安装 这里介绍 ubuntu 下的安装,其他平台可以看 官方 ...

  7. 使用office打印到文件功能进行打印测试

     大家在日常的支持工作中常会遇到各种打印问题,所以进行一些打印测试也在所难免.但是每次跑来跑去浪费了宝贵的时间,打印又浪费了纸张资源.我们也会想到安装虚拟打印机,但因为没有合适的软件,结果是我们只 ...

  8. SQLite中7(8)形参的query语句的用法

    SQLite中7(8)形参的query语句的用法 我们先来看看这种7形参的query语句的形参列表: public Cursor query(String table, String[] column ...

  9. adb 脚本

    1.打印可以ping到的IP地址 @echo offset a=1:startecho %a% \\把a打印到shellping 172.19.5.%a% -w 1 -n 1|find /i &quo ...

  10. maven 编译插件指定jdk版本的两种方式

    第一种方式: <plugin> <artifactId>maven-compiler-plugin</artifactId> <configuration&g ...