《Javascript高级程序设计》读书笔记之继承
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
代码示例中,完整原型链如下

原型链继承的问题:父类型引用类型的属性会被所有子类型实例共享,这是不符合预期的
function SuperType()
{
this.colors=["red","blue","green"];
} function SubType()
{
}
//继承SuperType
SubType.prototype=new 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","black"
2.借用构造函数继承
基本思想是在子类型构造函数内部调用超类型构造函数
function SuperType()
{
this.colors=["red","blue","green"];
} function SubType()
{
//继承SuperType
SuperType.call(this);
} 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"
借用构造函数可以像超类型构造函数传递参数
function SuperType(name)
{
this.name=name;
} function SubType()
{
//继承SuperType
SuperType.call(this,"Jim");
this.age=28;
} var instance1=new SubType();
alert(instance1.name);//"Jim"
alert(instance1.age);//
借用构造函数的问题:不能复用超类型的方法
3.组合继承
使用原型链实现对原型属性和方法的继承,通过借用构造函数实现对实例属性的继承
function SuperType(name)
{
this.name=name;
this.colors=["red","blue","green"];
}
SuperType.prototype.sayName=function(){
alert(this.name);
};
function SubType(name,age)
{
//继承SuperType
SuperType.call(this,name);
this.age=age;
}
SubType.prototype=new SuperType();
SubType.prototype.sayAge=function(){
alert(this.age);
}
var instance1=new SubType("Jim",29);
instance1.colors.push("black");
alert(instance1.colors);//"red","blue","green","black"
instance1.sayName();//"Jim"
instance1.sayAge();// var instance2=new SubType("Jack",28);
alert(instance2.colors);//"red","blue","green"
instance2.sayName();//"Jack"
instance2.sayAge();//
4.寄生组合式继承
寄生组合式继承,解决了组合继承中,两次调用超类型构造函数的问题
function object(o)
{
function F(){}
F.prototype=o;
return new F();
}
function inheritPrototype(subType,superType)
{
var prototype =object(superType.prototype);
prototype.constructor=superType;//原书是prototype.constructor=subType,看书时认为这里应该是superType
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
SuperType.call(this,name);
this.age=age;
}
inheritPrototype(SubType,SuperType);
SubType.prototype.sayAge=function(){
alert(this.age);
}
var instance1=new SubType("Jim",29);
instance1.colors.push("black");
alert(instance1.colors);//"red","blue","green","black"
instance1.sayName();//"Jim"
instance1.sayAge();// var instance2=new SubType("Jack",28);
alert(instance2.colors);//"red","blue","green"
instance2.sayName();//"Jack"
instance2.sayAge();//
《Javascript高级程序设计》读书笔记之继承的更多相关文章
- javascript高级程序设计读书笔记-事件(一)
读书笔记,写的很乱 事件处理程序 事件处理程序分为三种: 1.html事件2. DOM0级,3,DOM2级别 没有DOM1 同样的事件 DOM0会顶掉html事件 因为他们都是属性 而 ...
- 《JavaScript高级程序设计》笔记——关于继承
继承在JavaScript中是一种“奇葩”的存在,因为其本身并没有类(class)的概念(ES5),所以只能用其他方式(原型链.构造函数.对象实例)来模拟继承的行为.既然是模拟,那就应该是想办法实现继 ...
- javascript高级程序设计读书笔记
第2章 在html中使用javascript 一般都会把js引用文件放在</body>前面,而不是放在<head>里, 目的是最后读取js文件以提高网页载入速度. 引用js文 ...
- Javascript高级程序设计读书笔记(第六章)
第6章 面向对象的程序设计 6.2 创建对象 创建某个类的实例,必须使用new操作符调用构造函数会经历以下四个步骤: 创建一个新对象: 将构造函数的作用域赋给新对象: 执行构造函数中的代码: 返回新 ...
- JavaScript高级程序设计-读书笔记(7)
第22章 高级技巧 1.高级函数 (1)安全的类型检测 在任何值上调用Object原生的toString()方法,都会返回一个[object NativeConstructorName]格式的字符串. ...
- JavaScript高级程序设计-读书笔记(3)
第8章 BOM 1.window对象 (1)全局作用域 BOM的核心对象是window,它表示浏览器的一个实例.在浏览器中,window对象既是通过JavaScript访问浏览器窗口的一个接口,又是E ...
- JavaScript高级程序设计-读书笔记(2)
第6章 面向对象的程序设计 创建对象 1.最简单方式创建Object的实例,如 var person = new Object(); person.name = “Greg”; person.age ...
- JavaScript高级程序设计-读书笔记(1)
第1章 JavaScript简介 JavaScript是一种专为与网页交互而设计的脚本语言,由下列三个不同的部分组成: l ECMAScript:提供核心语言功能: l 文 ...
- javascript高级程序设计读书笔记----引用类型
Array类型. ECMAScript数组的每一项可以保存任何类型的数据. 数组大小是可以动态调整的. 创建数组第一种基本方式方式: 使用Array构造函数 var colors = new ...
- JavaScript高级程序设计 读书笔记
第一章 JavaScript 简介 第二章 Html中使用JavaScript 第三章 基本概念 第四章 变量,作用域,内存 第五章 引用类型 第六章 面向对象 第七章 函数表达式 第八章 BOM 第 ...
随机推荐
- String,StringBuffer与StringBuilder差异??
String 字符串常量StringBuffer 字符串变量(线程安全)StringBuilder 字符串变量(非线程安全) 简要地, String 类型和 StringBuffer 类型的主要性能差 ...
- 插件 - 提示窗体(ArtDialog)
效果: 代码: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default. ...
- javascript (十三) 函数
JavaScript 函数语法 函数就是包裹在花括号中的代码块,前面使用了关键词 function: function functionname() { 这里是要执行的代码 } 当调用该函数时,会执行 ...
- Delphi事件的广播 good
明天就是五一节了,辛苦了好几个月,借此机会应该尽情放松一番.可是想到Blog好久没有写文章,似乎缺些什么似的.这几个月来在项目中又增长了许多经验,学到许多实际应用的知识.不如把一些比较有用的记录下来, ...
- Python基础 2----Python 基础语法
1 模块导入原理 1 模块是包含函数,类,变量的独立的Python文件 2 导入系统的模块 比如我在家目录下创建一个m.py的文件,我们导入了许多的系统模块,比如time,string等等.这边就类似 ...
- 链栈之C++实现
链栈是借用单链表实现的栈.其不同于顺序栈之处在于: 1.链栈的空间是程序运行期间根据需要动态分配的,机器内存是它的上限.而顺序栈则是 静态分配内存的. 2.链栈动态分配内存的特性使得它一般无需考虑栈溢 ...
- Delphi调用C++导出的QT类
打开VS2008创建一个dll项目(创建了一个QT Library项目),新建头文件q4dapplication.h定义纯虚类: #ifndef Q4DAPPLICATION#define Q4DAP ...
- pptv web前端面试题
今天上午一考完试,就一直等待pptv的电话,结果下午就收到了pptv的通知(pptv的效率还是很不错的,之前面试官和我说在一到两周之内给回复,结果过了7天就给回复了,赞一个)因为我面试的是web前端( ...
- 人脸对齐ASM-AAM-CLM的一些总结
源地址:http://blog.csdn.net/piaomiaoju/article/details/8918107 ASM算法相对容易,其中STASM是目前正面脸当中比较好的算法,原作者和CLM比 ...
- thinkPHP 模板的使用技巧(十三)
原文:thinkPHP 模板的使用技巧(十三) 模板的使用技巧:页面跳转 .模板包含.模板渲染.模板的继承 页面跳转 <a href='__URL__/index'>我要跳转到首页面,用这 ...