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高级程序设计》读书笔记之继承的更多相关文章

  1. javascript高级程序设计读书笔记-事件(一)

    读书笔记,写的很乱   事件处理程序   事件处理程序分为三种: 1.html事件2. DOM0级,3,DOM2级别  没有DOM1 同样的事件 DOM0会顶掉html事件   因为他们都是属性  而 ...

  2. 《JavaScript高级程序设计》笔记——关于继承

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

  3. javascript高级程序设计读书笔记

    第2章  在html中使用javascript 一般都会把js引用文件放在</body>前面,而不是放在<head>里, 目的是最后读取js文件以提高网页载入速度. 引用js文 ...

  4. Javascript高级程序设计读书笔记(第六章)

    第6章  面向对象的程序设计 6.2 创建对象 创建某个类的实例,必须使用new操作符调用构造函数会经历以下四个步骤: 创建一个新对象: 将构造函数的作用域赋给新对象: 执行构造函数中的代码: 返回新 ...

  5. JavaScript高级程序设计-读书笔记(7)

    第22章 高级技巧 1.高级函数 (1)安全的类型检测 在任何值上调用Object原生的toString()方法,都会返回一个[object NativeConstructorName]格式的字符串. ...

  6. JavaScript高级程序设计-读书笔记(3)

    第8章 BOM 1.window对象 (1)全局作用域 BOM的核心对象是window,它表示浏览器的一个实例.在浏览器中,window对象既是通过JavaScript访问浏览器窗口的一个接口,又是E ...

  7. JavaScript高级程序设计-读书笔记(2)

    第6章 面向对象的程序设计 创建对象 1.最简单方式创建Object的实例,如 var person = new Object(); person.name = “Greg”; person.age ...

  8. JavaScript高级程序设计-读书笔记(1)

    第1章 JavaScript简介 JavaScript是一种专为与网页交互而设计的脚本语言,由下列三个不同的部分组成: l        ECMAScript:提供核心语言功能: l        文 ...

  9. javascript高级程序设计读书笔记----引用类型

        Array类型. ECMAScript数组的每一项可以保存任何类型的数据. 数组大小是可以动态调整的. 创建数组第一种基本方式方式: 使用Array构造函数 var colors = new ...

  10. JavaScript高级程序设计 读书笔记

    第一章 JavaScript 简介 第二章 Html中使用JavaScript 第三章 基本概念 第四章 变量,作用域,内存 第五章 引用类型 第六章 面向对象 第七章 函数表达式 第八章 BOM 第 ...

随机推荐

  1. HUNNU11342:Chemistry(模拟)

    http://acm.hunnu.edu.cn/online/?action=problem&type=show&id=11342 Problem description The ch ...

  2. 11gR2(11.2) RAC TAF Configuration for Admin and Policy Managed Databases (文档 ID 1312749.1)

    In this Document   Purpose   _afrLoop=1459323732561579&id=1312749.1&displayIndex=10&_afr ...

  3. 用"池"来提升对象的复用

    对象池化是目前常用的一种系统优化的技术.通俗的说也就是一个对象不用多次的被实例化,来消耗性能,可以把这些常用的类放入一个池中,当需要的时候在去池里去拿去,不用的时候 在放入池中.可以叫做对象池.他可以 ...

  4. 与众不同 windows phone (31) - Communication(通信)之基于 Socket UDP 开发一个多人聊天室

    原文:与众不同 windows phone (31) - Communication(通信)之基于 Socket UDP 开发一个多人聊天室 [索引页][源码下载] 与众不同 windows phon ...

  5. Extjs学习----------动态载入js文件(减轻浏览器的压力)

    动态载入js文件能够减轻浏览器的压力,本例使用了Ext.window.Window组件,该组件的学习地址:http://blog.csdn.net/z1137730824/article/detail ...

  6. codeforces 659C Tanya and Toys

    题目链接:http://codeforces.com/problemset/problem/659/C 题意: n是已经有的数字,m是可用的最大数字和 要求选自己没有的数字,且这些数字的数字和不能超过 ...

  7. java--ThreadPool线程池简单用法

    package com.threadPool; import java.util.concurrent.ArrayBlockingQueue; import java.util.concurrent. ...

  8. mongodb时间戳转换成格式化时间戳

    db.pay_order.find({"id":"5332336532"},{"tradeNo":true,"status&quo ...

  9. Fitnesse使用系列二

    决策表 Fitnesse中提供了好几种表格样式,前面说了.表格是运行測试的关键.从字面看.表格描写叙述的是測试用例.从运行角度看,表格为后端的代码(fitnesse里称作fixture)提供了包名.类 ...

  10. hdu1532(最大流)

    传送门:Drainage Ditches 题意:给出n个河流,m个点,以及每个河流的流量,求从1到m点的最大流量. 分析:网络流入门题,第一次写按照白书上毫无优化的Ford_fulkerson算法,先 ...