一、基于原型链方式实现的继承

缺点:无法从子类中调用父类的构造函数,所以没有办法把子类的属性赋值到父类中。

如果父类中有引用类型,例如:数组。此时这个引用类型会添加到子类的原型当中,一但子类某个对象修改,则影响全部其他对象。

参考代码:

  

function Parent(){
this.pv = "parent";
this.color = ["red","yellow"];
}
Parent.prototype.showParentValue = function(){
alert(this.pv);
}
function Child(){
this.cv = "child";
}
Child.prototype = new Parent();
Child.prototype.showChildValue = function(){
alert(this.cv);
} var c1 = new Child();
//Child中的原型的color被修改
c1.color.push("bule");//red yellow blue
alert(c1.color);
var c2 = new Child();//同样影响c2中color值
alert(c2.color);//red yellow blue

二、基于伪装方式实现的继承

缺点:没有完成原型的指向。只能继承父类属性无法完成父类方法的继承。

参考代码:

function Parent(name){
this.color = ["red","blue"];
this.name=name;
}
function Child(name,age){
this.age = age;
Parent.call(this,name);//用第一个变量的上下文调用这个函数
}
var c1 = new Child("Leon",12);
var c2 = new Child("Ada",22);
alert(c1.name + "," +c1.age);
alert(c2.name + "," +c2.age);

三、终极方案-组合方式实现继承
原理:通过原型链方式实现方法的继承,通过伪装方式实现属性的继承。

参考代码:

/**
* 组合的实现方式是属性通过伪造的方法实现,方法通过原型链的方式实现
*/
function Parent(name){
this.color = ["red","blue"];
this.name = name;
}
Parent.prototype.ps = function(){
alert(this.name + "[" + this.color + "]");
}
function Child(name,age){
//已经完成了伪造
Parent.call(this,name);
this.age = age;
}
Child.prototype = new Parent();
Child.prototype.say = function(){
alert(this.name + "," + this.age + "[" + this.color + "]")
} var c1 = new Child("rigid",30);

javascrpt 继承的更多相关文章

  1. web前端学习(二) javascript对象和原型继承

    目录 1. JavaScrpt对象 2. 原型对象和继承 3. 对象的克隆 (1)javascript对象 在JS中,对象是属性的容器.对于单个对象来说,都由属性名和属性值构成:其中属性名需要是标识符 ...

  2. 面向对象的Javascript(5):继承

    在小项目中对于JavaScript使用,只要写几个function就行了.但在大型项目中,尤其是在开发追求 良好的用户体验的网站中,如SNS,就会 用到大量的JavaScrpt,有时JavaScrip ...

  3. javaScript的原型继承与多态性

    1.prototype 我们可以简单的把prototype看做是一个模版,新创建的自定义对象都是这个模版(prototype)的一个拷贝 (实际上不是拷贝而是链接,只不过这种链接是不可见,给人们的感觉 ...

  4. JavaScript的继承实现方式

    1.使用call或apply方法,将父对象的构造函数绑定在子对象上 function A(){ this.name = 'json'; } function B(){ A.call(this); } ...

  5. javascript中的继承与深度拷贝

    前言 本篇适合前端新人,下面开始...... 对于前端新手来说(比如博主),每当对js的对象做操作时,都是一种痛苦,原因就是在于对象的赋值是引用的传递,并非值的传递,虽然看上去后者赋值给了前者,他们就 ...

  6. 谈谈一些有趣的CSS题目(四)-- 从倒影说起,谈谈 CSS 继承 inherit

    开本系列,讨论一些有趣的 CSS 题目,抛开实用性而言,一些题目为了拓宽一下解决问题的思路,此外,涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题中有你感觉 ...

  7. JS继承类相关试题

    题目一: //有关于原型继承的代码如下:function Person(name) {   this.name = name;}Person.prototype = {     getName : f ...

  8. JS继承之寄生类继承

    原型式继承 其原理就是借助原型,可以基于已有的对象创建新对象.节省了创建自定义类型这一步(虽然觉得这样没什么意义). 模型 function object(o){ function W(){ } W. ...

  9. JS继承之借用构造函数继承和组合继承

    根据少一点套路,多一点真诚这个原则,继续学习. 借用构造函数继承 在解决原型中包含引用类型值所带来问题的过程中,开发人员开始使用一种叫做借用构造函数(constructor stealing)的技术( ...

随机推荐

  1. MATLAB学习笔记(六)——MATLAB数据分析与多项式计算

    (一)数据处理统计 一.最大值和最小值 1.求向量的最大值和最小值 y=max(X); %返回向量X的最大值存入y,如果X中含有复数则按模最大的存入y [y,I]=max(X);%返回向量X的最大值存 ...

  2. android 获取路径目录方法以及判断目录是否存在,创建目录

    Environment 常用方法: * 方法:getDataDirectory()解释:返回 File ,获取 Android 数据目录.* 方法:getDownloadCacheDirectory( ...

  3. DOS常用的简单命令

    在windows下的cmd里使用 dir 列出当前目录下的文件及文件夹 md 创建目录 rd 删除目录(只能删除空目录) cd 进入指定目录 cd .. 返回上一级目录 cd / 返回到根目录 del ...

  4. OUYA设备的购买和安装

    OUYA设备的购买和安装 在为OUYA这款游戏终端做具体的开发之前,建议读者先上手感受一下这款设备的游戏体验.本节所涉及的内容包括,OUYA设备的购买.安装.设置,以及最终上手开始游戏这一系列的过程本 ...

  5. POJ 1743 (后缀数组+不重叠最长重复子串)

    题目链接: http://poj.org/problem?id=1743 题目大意:楼教主の男人八题orz.一篇钢琴谱,每个旋律的值都在1~88以内.琴谱的某段会变调,也就是说某段的数可以加减一个旋律 ...

  6. 1^b+2^b+3^b+...+n^b数列

    首先,这是我自己推出来的,O(n^2),常数巨大.所以无能为力优化!所以求此数列的公式!求优化!!! 主要思想:要算b次的,那么就要先算b+1次的. 首先,我用F(i, j)表示杨辉三角第i层第j个, ...

  7. MySQL 里面的Where 和Having和Count 和distinct和Group By对比

    mysql> select accid as uid,date(datetime) AS datetime from game.logLogin GROUP BY accid HAVING da ...

  8. Microsoft.AlphaImageLoader滤镜讲解

    Microsoft.AlphaImageLoader是IE滤镜的一种,其主要作用就是对图片进行透明处理.虽然FireFox和IE7以上的IE浏览器已经支持透明的PNG图片,但是就IE5-IE6而言还是 ...

  9. python中的list的方法

    list1=[1,3,5,"a"]print(dir(list1)) """ ['__add__', '__class__', '__contains ...

  10. 你们以为运营商只是HTTP插点广告而已么?

    国内某邮件服务商,近期在某南方地区有大量客户反应登录时出错和异常,于是工作人员进行了一下跟进,发现如下: 首先,邮件服务商登陆页面为普通HTTP协议发送,提交时通过JS进行RSA加密(没错,JS的RS ...