《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

View Code

代码示例中，完整原型链如下

原型链继承的问题：父类型引用类型的属性会被所有子类型实例共享，这是不符合预期的

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"

View Code

2.借用构造函数继承

基本思想是在子类型构造函数内部调用超类型构造函数

function SuperType()
{this.colors=["red","blue","green"];
}function SubType()
{//继承SuperTypeSuperType.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"

View Code

借用构造函数可以像超类型构造函数传递参数

function SuperType(name)
{this.name=name;
}function SubType()
{//继承SuperTypeSuperType.call(this,"Jim");this.age=28;
}var instance1=new SubType();
alert(instance1.name);//"Jim"
alert(instance1.age);//28

View Code

借用构造函数的问题：不能复用超类型的方法

3.组合继承

使用原型链实现对原型属性和方法的继承，通过借用构造函数实现对实例属性的继承

function SuperType(name)
{this.name=name;this.colors=["red","blue","green"];
}
SuperType.prototype.sayName=function(){alert(this.name);
};
function SubType(name,age)
{//继承SuperTypeSuperType.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();//29var instance2=new SubType("Jack",28);
alert(instance2.colors);//"red","blue","green"
instance2.sayName();//"Jack"
instance2.sayAge();//28

View Code

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，看书时认为这里应该是superTypesubType.prototype=prototype;
}
function SuperType(name)
{this.name=name;this.colors=["red","blue","green"];
}
SuperType.prototype.sayName=function(){alert(this.name);
};
function SubType(name,age)
{//继承SuperTypeSuperType.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();//29var instance2=new SubType("Jack",28);
alert(instance2.colors);//"red","blue","green"
instance2.sayName();//"Jack"
instance2.sayAge();//28

View Code

转载于:https://www.cnblogs.com/GongQi/p/4029678.html

《Javascript高级程序设计》读书笔记之继承相关推荐

javascript高级程序设计读书笔记2
<!DOCTYPE HTML>//这个网页的文档类型,这个是html5的写法 Bootstrap使用的某些HTML元素和CSS属性需要文档类型为HTML5 doctype.因此这一文档类型 ...
javascript高级程序设计读书笔记----引用类型
Array类型. ECMAScript数组的每一项可以保存任何类型的数据. 数组大小是可以动态调整的. 创建数组第一种基本方式方式: 使用Array构造函数 var colors = new Arra ...
JavaScript高级程序设计-读书笔记（6）
第20章 JSON JSON是一个轻量级的数据格式,可以简化表示复杂数据结构的工作量 JSON的语法可以表示一下三种类型的值 l 简单值:使用与JavaScript相同的语法,可以在JS ...
JavaScript高级程序设计读书笔记（一）
第一章总结: JavaScript是一种专为与网页交互设计的脚本语言. 由三个不同的部分组成: ECMAScript, 由ECMA-262定义,提供核心语言功能: DOM(文件对象模型),提供访问和 ...
Javascript高级程序设计--读书笔记--第八章BOM
BOM(browser object model 浏览器对象模型) BOM的核心对象是window,它表示浏览器的一个实例.在浏览器钟,window对象有双重角色,它既是通过javascript 访问 ...
JavaScript高级程序设计读书笔记(第5章引用类型之Array类型)
为什么80%的码农都做不了架构师?>>> 1.数组长度 //lenth会自动更新 var arr=["black","red","g ...
JavaScript高级程序设计读书笔记(第8章BOM之location对象查询字符串参数)
为什么80%的码农都做不了架构师?>>> location对象查询字符串参数 //location.search返回从问号到URL末尾的所有内容function getQuerySt ...
JavaScript高级程序设计读书笔记(第6章面向对象的程序设计之创建对象)
2019独角兽企业重金招聘Python工程师标准>>> 面向对象语言都有"类"的概念,而通过类可以创建任意多个具有相同属性和方法的对象. JS中没有"类 ...
javascript高级程序设计读书笔记1
浮点数虽然精度很高,但在实际计算中的精度可能不如整数.比如0.1+0.2并不等于0.3,而是0.3000000000000004,所以把浮点数的计算结果当做判断条件会产生失误,这是基于IEEE754数 ...
《javascript高级程序设计》笔记：内存与执行环境
上一篇:<javascript高级程序设计>笔记:继承近几篇博客都会围绕着图中的知识点展开由于javascript是一门具有自动垃圾收集机制的编程语言,开发者不必担心内存的分配和回收的 ...

《Javascript高级程序设计》读书笔记之继承

1.原型链继承

2.借用构造函数继承

3.组合继承

4.寄生组合式继承

《Javascript高级程序设计》读书笔记之继承相关推荐

最新文章

热门文章