继承在JavaScript中是一种“奇葩”的存在,因为其本身并没有类(class)的概念(ES5),所以只能用其他方式(原型链、构造函数、对象实例)来模拟继承的行为。既然是模拟,那就应该是想办法实现继承的行为特点,个人认为继承的核心就是:能复用就复用,不能复用的就复制

     写在前面:
  方法是属性的特殊形式,这里就用属性全权代表。
     函数构造器里的属性是实例属性,每个实例都有自己的一份,实例之间互不影响。
     原型对象里的属性为每个实例共享,一旦改变,所有实例的原型属性都改变。
  以下的父类(SuperType)和子类(SubType)都有自己的实例属性和原型属性,各自的构造函数就不重复了,只列出继承核心步骤以突出重点。

     1.原型链继承:

 SubType.prototype = new SuperType();
     特点:父类的所有属性(包括实例属性和原型属性)都作为了子类的原型属性。
     说明:纳尼?!一下都弄到原型属性里这样合适么,你考虑过实例属性的感受么?在父级既然是每个实例独享一份,到了子类却变成共享的了,这样使用限制很大哟!
 
     2.借用构造函数继承:
     克服原型链的不足:实例属性用构造器继承。
 
 function SubType(){
  SuperType.call(this);
}
     特点:父类的实例属性在子类还是实例属性,每个实例独一份互不干扰;另外,还可以利用call方法的特性给父类的构造函数传递参数。
     说明:原型链的问题克服了,复用呢?父类的原型属性根本就没有在子类中体现啊!这样也没法用呢。
 
     3.组合继承:
     综合一下前两种继承的优点吧,上帝的归上帝,凯撒的归凯撒。
 
function SubType(){
//继承实例属性
SuperType.call(this);
}
//继承原型属性
SubType.prototype = new SuperType();
     特点:这样比较完美了,父类的实例属性在子类中单独继承,原型属性也有了复用的特点;并且保留了传参数的优点。
     说明:但是处女座的朋友会发现,这关键的两步都调用了父类的构造函数,直接结果就是子类继承父类的实例属性会存在两份,一份在子类的原型对象中,一份在子类实例中,只不过原型属性被实例属性覆盖罢了。这是多么可耻的浪费啊!
 
     4.寄生组合式继承:
     请先不要问我“寄生”是什么意思~~组合继承的“浪费”主要是在原型链继承的过程中发生的,所以我们现在不借助父级实例重写子类原型对象,单独给子类一个只包括父类原型对象属性的对象即可。
     首先来个用于复制父类原型对象的工具函数:    

 function copy(uber){//工具函数
  var F = function(){};
  F.prototype = uber;
  return new F();
}
//继承实例属性
function SubType(){
  SuperType.call(this);
}
//继承原型属性
SubType.prototype = copy(SubType.prototype);
SubType.prototype.constructor = SubType; //不要忘记修正constructor
     特点:完美实现了继承,而且没有浪费内存空间,还能传参;就是写起来有点儿麻烦
 
     5.原型式继承
     好吧回过头来说一下这个寄生,在讲寄生前允许我啰嗦一下“原型式继承”:

 function copy(obj){
var F = function(){};
F.prototype = obj;
return new F();
}
     特点:这种继承基于实例,只需给一个父类的实例对象就“还”一个子类实例对象,直接绕过构造函数,很简单吧。
     说明:与其说是继承,其实这种方式更像是一种对象的“浅复制”,而且还有两个缺陷:1.不同子对象之间根本就没有函数的复用,2.由于是浅复制不同子对象之间会共用引用类型的属性,不能随意改动。但作者尼古拉斯说是,那就是吧。
     
     6.寄生式继承
     寄生式继承是对原型式继承的一种加强:
 
 function createAnother(original){
var clone = object(original); //不一定必须用object方法,基于original复制新创建的即可
clone.sayHi = funciton(){ …… } // 增强
return clone;
}
     特点:这里返回的clone不仅有original的所有属性,还有自己的方法。
     说明:寄生组合式继承的两个缺陷没有修复,所以我觉得这个继承方式依然很牵强;个人感觉“寄生”的由来就是将自己sayHi放在了original上面,额……回到第四种继承方式,我想体现寄生的地方就在于SubType.prototype.constructor = SubType(个人观点)
 
     总结:最常用的继承方式应该是组合式继承  和  寄生组合式继承
     
     以上是基于JS红宝书6.3继承章节的一些读书心得,欢迎吐槽。
 
 

《JavaScript高级程序设计》笔记——关于继承的更多相关文章

  1. JavaScript高级程序设计笔记之面向对象

    说起面向对象,大部分程序员首先会想到 类 .通过类可以创建许多具有共同属性以及方法的实例或者说对象.但是JavaScript并没有类的概念,而且在JavaScript中几乎一切皆对象,问题来了,Jav ...

  2. Javascript高级程序设计笔记(很重要尤其是对象的设计模式与继承)

    var obj = {'a':'a'}; var fun = function (){} console.log(typeof obj);//object console.log(typeof fun ...

  3. javascript高级程序设计--笔记01

    概述 JavaScript的实现包含三个部分: 1  核心(ECMAScript)   提供核心语言功能 2  文档对象模型(DOM)  一套提供了访问以及操作网页内容的API 3  浏览器对象模型( ...

  4. javascript事件小结(事件处理程序方式)--javascript高级程序设计笔记

    1.事件流:描述的是从页面中接收事件的顺序. 2.事件冒泡:IE的事件流叫做事件冒泡,即事件开始从具体的元素(文档中嵌套层次最深的那个节点)接收,然后逐级向上传播到不具体的节点(文档). 3.事件捕获 ...

  5. JavaScript高级程序设计笔记(一)

    ---恢复内容开始--- 前三章为基础知识,为了方便以后查看,所以比较啰嗦.这里对函数的基本操作没有记录. 1.JavaScript的实现 虽然 JavaScript 和 ECMAScript 通常都 ...

  6. JavaScript高级程序设计笔记 事件冒泡和事件捕获

    1.事件冒泡 要理解事件冒泡,就得先知道事件流.事件流描述的是从页面接收事件的顺序,比如如下的代码: <body> <div> click me! </div> & ...

  7. <javascript高级程序设计>笔记

    1.要讲一个值转换成其对应的Boolean类型 ,可以调用转型函数Boolean(). var message=“hello world!”; var messageAsBoolean=Boolean ...

  8. javaScript高级程序设计笔记 2

    Undefinde Null Boolean Number String    基本类型 Object    引用类型 只有引用类型才能动态的添加属性 赋值基本类型和引用类型也不相同,复制的基本类型的 ...

  9. javaScript高级程序设计笔记 1

    核心  ECMAScript 文档对象模型  DOM 浏览器对象模型 BOM 延迟脚本  defer typeof操作符      判断字符类型  返回   undefined  boolean  s ...

  10. Javascript高级程序设计笔记 <第五章> 引用类型

    一.object类型 创建object实例的方式有两种: //第一种使用new操作符跟构造函数 var person= new Object(); person.name="小王" ...

随机推荐

  1. Oracle数据库定时任务配置和日志执行情况查询

    基础配置: /***************************************************************** * * 移动抵扣券快到期推送提醒 * 首次执行 : 2 ...

  2. GitHub 上排名前 100 的 Android 开源库进行简单的介绍

    若有任何疑问可通过邮件或微博联系我 项目名称 项目简介 1. react-native 这个是 Facebook 在 React.js Conf 2015 大会上推出的基于 JavaScript 的开 ...

  3. Qt之图标切分与合并

    有些时候会将多张有相同功能的图片绘制成一张,不管是使用或者绘制上都会方便很多.对美工与开发者来说也都是一件省事.省力.更省心的方式.二全其美,又何乐而不为呢... 例如:QQ等级     0-9可以组 ...

  4. MyEclipse使用总结——使用MyEclipse打包带源码的jar包

    平时开发中,我们喜欢将一些类打包成jar包,然后在别的项目中继续使用,不过由于看不到jar包里面的类的源码了,所以也就无法调试,要想调试,那么就只能通过关联源代码的形式,这样或多或少也有一些不方便,今 ...

  5. Java带包编译运行

    package cn.togeek.job; public class Test { public static void main(String[] args) throws Exception { ...

  6. Some tips on using HashSet<T> and List<T>

    This article is written based on my colleague's review Most of the times, when I want to use a colle ...

  7. 【JavsScript】一个元素绑定多个事件

    <script> document.getElementById("a").addEventListener("click", function() ...

  8. Unity3D中事件函数的运行顺序

    Unity3D中脚本的生命周期是依照预先定义好的事件函数的运行流程来演化的,详细流程例如以下: Editor模式下Reset: 当脚本第一次被挂到GameObject上或用户点击Resetbutton ...

  9. 基于W5500的嵌入式SNMP代理端实现

     一 实验背景 近期一个做焊接设备的朋友想在焊机上加入监控的新功能,实时获取焊机的温度.功耗等參数,还可简单控制,实现对集群焊接设备的网络化管理.而这个朋友不想在开发管理系统上花太多精力,想找一个 ...

  10. 你真的了解javascript吗

    原文地址:http://dmitry.baranovskiy.com/post/91403200 看了文章中五个小例子,写了写自己的理解 #demo1 if (!("a" in w ...