Javascript高级程序设计读书笔记(第六章)
第6章 面向对象的程序设计
6.2 创建对象
创建某个类的实例,必须使用new操作符调用构造函数会经历以下四个步骤:
- 创建一个新对象;
- 将构造函数的作用域赋给新对象;
- 执行构造函数中的代码;
- 返回新对象。
构造函数的问题:每个方法都要在每个实例上重新创建一遍;
理解原型对象:
无论何时,只要创建了一个新函数,就会根据一组特定的规则为该函数创建一个prototype属性,这个属性指向函数的原型对象。默认情况下,所有原型对象都会自动获得一个constructor属性,这个属性包含一个指向prototype属性所在函数的指针。如下面的例子:
function Person() {
}
Person.prototype.name = "Nicholas";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function() {
alert(this.name);
};
var person1 = new Person();
person1.sayName(); //"Nicholas"
如下图所示展示了各个对象之间的关系:

6.3 继承
6.3.1 原型链继承
基本思想:利用原型让一个引用类型继承另一个引用类型的属性和方法。即让子类的原型对象等于父类的实例。
存在的问题:
function SuperType() {
this.colors = ["red", "blue", "green"];
}
function SubType() {
}
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
colors本来属于SuperType的实例属性,但是SubType继承以后就变成了SubType的原型属性,结果是SubType的所有实例都会共享这一个colors属性。
另一个问题:在创建子类型的实例时,不能向超类型的构造函数中传递参数。
6.3.2 借用构造函数
基本思想:在子类型构造函数的内部调用超类型构造函数。如下所示:
function SuperType() {
this.colors = ["red", "blue", "green"];
}
function SubType() {
SuperType.call(this); //继承了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
相对于原型链,借用构造函数有一个很大的优势,可以在子类型构造函数中向超类型构造函数传递参数。
借用构造函数的问题:
方法都在构造函数中定义,因此函数复用无从谈起,所有类型都只能使用构造函数模式。在超类型的原型中定义的方法,对子类型而言也是不可见的。
6.3.3 组合继承
组合继承是将原型链和借用构造函数的技术组合到一起,从而发挥二者之长的一种继承模式。基本思想是:使用原型链实现对原型属性和方法的继承,而通过构造函数来实现对实例属性的继承。
function SuperType(name) {
this.name = name;
this.colors = ["red", "blue", "green"];
};
SuperType.prototype.sayName = function() {
alert(this.name);
};
function SubType(name, age) {
//继承属性
SuperType.call(this, name);
this.age = age;
}
//继承方法
SubType.prototype = new SuperType();
SubType.prototype.sayAge = function() {
alert(this.age);
}
var instance1 = new SubType("Nicholas", 29);
instance1.colors.push("black");
alert(instance1.colors);
instance1.sayName(); //Nicholas
instance1.sayAge(); //
var instance2 = new SubType("Grey", 27);
alert(instance2.colors); //"red,blue,green"
instance2.sayName(); //Grey
instance2.sayAge(); //
组合继承避免了原型链和借用构造函数的缺陷,成为Javascript中最常用的继承模式
6.3.4 原型式继承
Javascript高级程序设计读书笔记(第六章)的更多相关文章
- Javascript高级程序设计读书笔记(第二章)
第二章 在HTML中使用Javascript 2.1<script>元素 延迟脚本(defer = "defer")表明脚本在执行时不会影响页面的构造,脚本会被延迟到 ...
- JavaScript高级程序设计学习笔记第六章--面向对象程序设计
1.ECMAScript没有类的概念,ECMA-262 把对象定义为:“无序属性的集合,其属性可以包含基本值.对象或者函数.”,有点类似于散列表 2.ECMAScript 中有两种属性:数据属性和访问 ...
- JavaScript高级程序设计 读书笔记
第一章 JavaScript 简介 第二章 Html中使用JavaScript 第三章 基本概念 第四章 变量,作用域,内存 第五章 引用类型 第六章 面向对象 第七章 函数表达式 第八章 BOM 第 ...
- javascript高级程序设计读书笔记-事件(一)
读书笔记,写的很乱 事件处理程序 事件处理程序分为三种: 1.html事件2. DOM0级,3,DOM2级别 没有DOM1 同样的事件 DOM0会顶掉html事件 因为他们都是属性 而 ...
- JavaScript高级程序设计 读书笔记 第一章
JavaScript是一种专门为与网页交互而设计的脚本语言 JavaScript实现 ECMAscript---核心 DOM---文档对象模型 BOM---浏览器对象模型
- Javascript高级程序设计读书笔记(第10章 DOM)
第10章 DOM 10.1 节点层次 每个节点都有一个nodeType属性,用于表明节点的类型.任何节点类型必是下面中的一个: Node.Element_NODE(1); NODE.ATTRIBUT ...
- Javascript高级程序设计读书笔记(第三章)
第3章 基本概念 3.4 数据类型 5种简单数据类型:undefined.boolean.number.null.string. typeof操作符,能返回下列某个字符串:“undefined”.“b ...
- JavaScript高级程序设计 读书笔记 第二章
<script>元素 直接在页面中嵌入JavaSript代码或包含外部JavaSript文件. 在代码中任何地方不能出现</script>,可通过转义字符'\'解决. 在XHT ...
- javascript高级程序设计读书笔记
第2章 在html中使用javascript 一般都会把js引用文件放在</body>前面,而不是放在<head>里, 目的是最后读取js文件以提高网页载入速度. 引用js文 ...
随机推荐
- C#。5 函数 类
函数:能够独立完成某个功能的模块. 好处:1.结构更清析(编写.维护方便 ).2.代码重用.3.分工开发. 四要素:名称,输入(参数),输出(返回的类型),加工(函 ...
- C# winCE5.0开发右键效果解决方案
用VS2008开发C#语言wince程序,发现程序里右键捕获不到,采集器上点也没反应,上网查好像有个c++版本的,看不懂啊,下面我给出C#实现右键效果的解决方案,请各位多多优化. 首先控件Contex ...
- hdu 2013
水题 AC代码: #include <iostream> using namespace std; int main() { int i,m,n; while(cin>>n) ...
- 触发器内insert,delete,update判断执行不同的内容
create trigger tr_aon afor insert,update,delere asbegin IF EXISTS(SELECT 1 FROM inserted) AND NOT EX ...
- hdu2896
数据水,但是各种wa各种t各种re最后照着别人的改了改发现了毛病 数组做指针传入的时候系统是不知道传入后的数字的长度的如果用memset他就只会讲指针的地方清零 #include<iostrea ...
- hdu5362 Just A String(dp)
转载请注明出处: http://www.cnblogs.com/fraud/ ——by fraud Just A String Time Limit: 2000/1000 MS (J ...
- JSP中页面定时刷新
1.JSP中页面定时刷新 <% //页面每隔30秒自动刷新一遍 response.setHeader("refresh" , "30" ); %> ...
- web移动开发的小细节(持续添加)
1.触屏设备上如何去掉数字转化为拨号链接的方法 <meta name=”format-detection” content=”telephone=no” /> telephone=no就禁 ...
- Proguard中optimize设置不当引发SimException
今天来说一下Proguard中关于optimize的问题.先上一张异常图片 最近项目重构,重新调整了各个组件之间的依赖关系.过程中,在项目Proguard这块卡住了,最开始还好,Proguard只是提 ...
- Anisotropic gauss filter
最近一直在做版面分析,其中文本行检测方面,许多文章涉及到了Anigauss也就是各向异性高斯滤波. 顾名思义,简单的理解就是参数不同的二维高斯滤波. 在文章Fast Anisotropic Gauss ...