读javascript高级程序设计06-面向对象之继承
原型链是实现继承的主要方法,通过原型能让一个引用类型继承另一个引用类型。
1.原型链实现继承
function SuperType(){
this.superprop=1;
}
SuperType.prototype={
showSuperprop:function(){
console.log(this.superprop);
}
}
function SubType(){
this.subprop=2;
}
SubType.prototype=new SuperType();
SubType.prototype.showSubprop=function(){
console.log(this.subprop);
}
var s=new SuperType();
s.showSuperprop();//
var s2=new SubType();
s2.showSuperprop();//
s2.showSubprop();//
注意:在使用原型链实现继承时,不能用对象字面量方法创建原型方法。
2.借用构造函数
在子类型构造函数内部调用超类型的构造函数。
function SuperType(){
this.numbers=[1,2,3];
}
function SubType(){
SuperType.apply(this);
}
var s=new SubType();
s.numbers.push(4);
console.log(s.numbers);//1,2,3,4
var s1=new SubType();
console.log(s1.numbers);//1,2,3
* 3.组合继承--原型链结合借用构造函数
使用原型链实现对原型对象属性和方法的继承,使用构造函数实现对实例对象属性的继承。
function Person(name){
this.name=name;
this.numbers=[1,2,3];
}
Person.prototype.sayName=function(){
console.log(this.name);
}
function Student(name,age){
Person.call(this,name);////第二次调用Person()
this.age=age;
}
Student.prototype=new Person();//第一次调用Person()
Student.prototype.sayAge=function(){
console.log(this.age);
}
var s=new Student('小张',15);
s.sayName();//小张
s.sayAge();//
s.numbers.push(5);
console.log(s.numbers);//[1, 2, 3, 5]
var s1=new Student('小兰',14);
s1.sayName();//小兰
s1.sayAge();//
console.log(s1.numbers);//[1, 2, 3]
组合继承是很常用的继承方式,但是它也有个缺点,就是需要调用两次超类型的构造函数。
*4.寄生式组合式继承
寄生组合式继承:借用构造函数继承属性,使用原型链的混合型式继承方法。寄生组合式是实现继承的最佳方式。
function object(o) {
function F() {
}
F.prototype = o;
return new F();
}
function inheritPrototype(superType, subType) {
var prototype = object(superType.prototype);
prototype.constructor = subType;
subType.prototype = prototype;
}
function superType(name) {
this.name = name;
}
superType.prototype.sayName = function () {
console.log('my name is ' + this.name);
}
function subType(name, age) {
superType.call(this, name);
this.age = age;
}
inheritPrototype(superType, subType);
subType.prototype.sayAge = function () {
console.log('my age is ' + this.age);
}
var s=new superType('Cathy');
s.sayName();//my name is Cathy
var s1 = new subType('Tom', 18);
s1.sayName();//my name is Tom
s1.sayAge();//my age is 18
读javascript高级程序设计06-面向对象之继承的更多相关文章
- 读javascript高级程序设计00-目录
javascript高级编程读书笔记系列,也是本砖头书.感觉js是一种很好上手的语言,不过本书细细读来发现了很多之前不了解的细节,受益良多.<br/>本笔记是为了方便日后查阅,仅作学习交流 ...
- 读javascript高级程序设计-目录
javascript高级编程读书笔记系列,也是本砖头书.感觉js是一种很好上手的语言,不过本书细细读来发现了很多之前不了解的细节,受益良多.<br/>本笔记是为了方便日后查阅,仅作学习交流 ...
- 读javascript高级程序设计08-引用类型之Global、Math、String
一.Global 所有在全局作用域定义的属性和方法,都属于Global对象. 1.URI编码: encodeURI():主要用于对整个URI编码.它不会对本身属于URI的特殊字符进行编码. encod ...
- 读Javascript高级程序设计第三版第六章面向对象设计--创建对象
虽然Object构造函数或者对象字面量都可以用来创建单个对象,但是缺点非常明显:使用同一接口创建很多对象,会产生大量重复代码. 工厂模式 1 function CreatePerson(name,a ...
- 读javascript高级程序设计10-DOM
一.节点关系 元素的childNodes属性来表示其所有子节点,它是一个NodeList对象,会随着DOM结构的变化动态变化. hasChildNodes():是否有子节点. var headline ...
- 读javascript高级程序设计14-错误处理与调试
一 错误类型 ECMA规定了常见的7种错误类型: Error: 基类型.其他常见的错误类型都继承自该类型,一般供开发人员抛出自定义错误. EvalError:该类型会在eval()函数使用异常时被抛 ...
- 《JavaScript高级程序设计》笔记——关于继承
继承在JavaScript中是一种“奇葩”的存在,因为其本身并没有类(class)的概念(ES5),所以只能用其他方式(原型链.构造函数.对象实例)来模拟继承的行为.既然是模拟,那就应该是想办法实现继 ...
- 读javascript高级程序设计17-在线检测,cookie,子cookie
一.在线状态检测 开发离线应用时,往往在离线状态时把数据存在本地,而在联机状态时再把数据发送到服务器.html5提供了检测在线状态的方法:navigator.onLine和online/offline ...
- 读javascript高级程序设计01-基本概念、数据类型、函数
一. javascript构成 1.javascript实现由三部分组成: ECMAScript:核心语言功能 DOM:文档对象模型,提供访问和操作网页内容的方法和接口 BOM:浏览器对象模型,提供与 ...
随机推荐
- JQuery执行DOM批量克隆并插入的提效方法
JQuery clone方法可以实现对指定DOM对象的快速复制,并插入文档中. 对于同一类型的对象往往需要按照同一样式模板(HTML标签代码)复制N份并插入文档中,然后再将内容填入模板中,这就需要批量 ...
- JAVA的网络编程
网络编程 网络编程对于很多的初学者来说,都是很向往的一种编程技能,但是很多的初学者却因为很长一段时间无法进入网络编程的大门而放弃了对于该部分技术的学习. 在 学习网络编程以前,很多初学者可能觉得网络编 ...
- Matlab中图片保存的5种方法
matlab的绘图和可视化能力是不用多说的,可以说在业内是家喻户晓的. Matlab提供了丰富的绘图函数,比如ez**系类的简易绘图函数,surf.mesh系类的数值绘图函数等几十个.另外其他专业工具 ...
- grep 常用参数详解
grep常用参数详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 刚刚和同事打完球,虽然自己输了~不过也蛮好玩的,好久没有玩过乒乓球啦,话说你喜欢玩乒乓球吗?好啦,话不多说说,让 ...
- Linux 下修改配置实现在当前目录下寻找可执行文件
# vim .bash_profile 添加 export LD_LIBRARY_PATH=$LD_LIBRARY_PATH:. # vreboot
- 《zw版·delphi与Halcon系列原创教程》THOperatorSetX版hello,zw
<zw版·delphi与Halcon系列原创教程>THOperatorSetX版hello,zw 下面介绍v3版的hello,zw. Halcon两大核心控件,THImagex.THOpe ...
- jquery判断起止时间大小和非空
//时间判断 function CheckDate() { var startTime = $('#txtTime').val(); //获取当前日期 var start = new Date(sta ...
- viewpager实现酷炫侧滑demo
晚上叫外卖,打开饿了么,发现推了一个版本,更新以后,点开了个鸡腿,哇,交互炫炸了. 不过还是有槽点.我是无意中才发现可以左右滑动的.这...你不告诉我,我怎么知道左右可以滑. https://gith ...
- mysql常用命令(3)
一.启动与关闭 1.1 Linux下启动mysql 的命令: a. rpm包安装:service mysqld start b. 源码包安装:/usr/local/mysql/bin/mysqld_s ...
- 原生JS--Ajax
原生Ajax: Ajax基础:--ajax:无刷新数据读取,读取服务器上的信息--HTTP请求方法: --GET:用于获取数据,如浏览帖子 --POST:用于上传数据,如用户注册 --GE ...