javascrpt 继承
一、基于原型链方式实现的继承
缺点:无法从子类中调用父类的构造函数,所以没有办法把子类的属性赋值到父类中。
如果父类中有引用类型,例如:数组。此时这个引用类型会添加到子类的原型当中,一但子类某个对象修改,则影响全部其他对象。
参考代码:
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 继承的更多相关文章
- web前端学习(二) javascript对象和原型继承
目录 1. JavaScrpt对象 2. 原型对象和继承 3. 对象的克隆 (1)javascript对象 在JS中,对象是属性的容器.对于单个对象来说,都由属性名和属性值构成:其中属性名需要是标识符 ...
- 面向对象的Javascript(5):继承
在小项目中对于JavaScript使用,只要写几个function就行了.但在大型项目中,尤其是在开发追求 良好的用户体验的网站中,如SNS,就会 用到大量的JavaScrpt,有时JavaScrip ...
- javaScript的原型继承与多态性
1.prototype 我们可以简单的把prototype看做是一个模版,新创建的自定义对象都是这个模版(prototype)的一个拷贝 (实际上不是拷贝而是链接,只不过这种链接是不可见,给人们的感觉 ...
- JavaScript的继承实现方式
1.使用call或apply方法,将父对象的构造函数绑定在子对象上 function A(){ this.name = 'json'; } function B(){ A.call(this); } ...
- javascript中的继承与深度拷贝
前言 本篇适合前端新人,下面开始...... 对于前端新手来说(比如博主),每当对js的对象做操作时,都是一种痛苦,原因就是在于对象的赋值是引用的传递,并非值的传递,虽然看上去后者赋值给了前者,他们就 ...
- 谈谈一些有趣的CSS题目(四)-- 从倒影说起,谈谈 CSS 继承 inherit
开本系列,讨论一些有趣的 CSS 题目,抛开实用性而言,一些题目为了拓宽一下解决问题的思路,此外,涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题中有你感觉 ...
- JS继承类相关试题
题目一: //有关于原型继承的代码如下:function Person(name) { this.name = name;}Person.prototype = { getName : f ...
- JS继承之寄生类继承
原型式继承 其原理就是借助原型,可以基于已有的对象创建新对象.节省了创建自定义类型这一步(虽然觉得这样没什么意义). 模型 function object(o){ function W(){ } W. ...
- JS继承之借用构造函数继承和组合继承
根据少一点套路,多一点真诚这个原则,继续学习. 借用构造函数继承 在解决原型中包含引用类型值所带来问题的过程中,开发人员开始使用一种叫做借用构造函数(constructor stealing)的技术( ...
随机推荐
- loj 1221(spfa判正环)
题目链接:http://acm.hust.edu.cn/vjudge/problem/viewProblem.action?id=25957 思路:由于路线为一个环,将路径上的权值改为c-p*d,那么 ...
- 提高C#编程水平的50个要点
下面的文章转载于 提高C#编程水平的50个要点 1.总是用属性 (Property) 来代替可访问的数据成员 2.在 readonly 和 const 之间,优先使用 readonly 3.在 as ...
- 拓扑排序 Codeforces Round #290 (Div. 2) C. Fox And Names
题目传送门 /* 给出n个字符串,求是否有一个“字典序”使得n个字符串是从小到大排序 拓扑排序 详细解释:http://www.2cto.com/kf/201502/374966.html */ #i ...
- eBay Notification介绍
1.简介 "通知服务"(约定为Notification的中文名称),是EbayAPI提供的一个便捷的工具,具有实时性的特点. 其设计思想基于发布-订阅模式.一旦客户端订阅了 ...
- onclientclick和onclick区别
OnClientClick是客户端脚本,一般使用javascript,在客户端,也就是IE中运行,点击后马上执行OnClick是服务器端事件处理函数,使用C#或者vb.net,在服务器端,也就是IIS ...
- HTMl5/CSS3/Javascript 学习推荐资源
HTMl5/CSS3/Javascript 学习推荐资源 前端的定义应该是数据内容的展示,在国内大家都觉得前端只是HTML+CSS+Javascript,但是实际上与展示有关的都是前端,所以Ruby/ ...
- Spring_讲解
http://s,i,s,h,u,o,k.com/forum/blogPost/list/6174.html
- PHP + Redis 实现一个简单的twitter
原文位于Redis官网http://redis.io/topics/twitter-clone Redis是NoSQL数据库中一个知名数据库,在新浪微博中亦有部署,适合固定数据量的热数据的访问. 作为 ...
- 用javascript协助导入图片
用javascript协助导入图片 需求 先说说需求.春节回家见爸妈,老爸迷上了摄影.他把平时的照片都上传到了 成都图片网, 这个成都图片网专门有一个 "快拍成都" 的版块,用于大 ...
- Linux环境下实现哲学家就餐问题
#include <stdio.h> #include <stdlib.h> #include <memory.h> #include <pthread.h& ...