javascript 继承实现方法


Posted in Javascript onAugust 26, 2009

下面我给出几种常用的方法:
1 .对象冒充
原理: 构造函数使用this关键字给所有属性和方法赋值, 因为构造函数只是一个函数,所以可以使ClassA的构造函数成为classB的方法,然后调用它.这样classB就会收到classA的构造函数中定义的属性和方法.例子:

function classA(name) 
{ 
this.name=name; 
this.showName=function(){alert(this.name);} 
} 
function classB(name) 
{ 
this.newMethod = classA; 
this.newMethod(name); 
} 
obj = new classA("hero"); 
objB = new classB("dby"); 
obj.showName(); // print hero 
objB.showName(); // print dby 说明classB 继承了classA的方法.

对象冒充可以实现多重继承 例如
function classz(){ 
this.newMethod = classX; 
this.newMethod(); 
delete this.newMethod; 
this.newMethod=classY; 
this.newMethod(): 
delete this.newMethod; 
}

但是如果classX和classY有相同的属性或者方法,classY具有高优先级.
2.call()方法
call方法使与经典的对象冒充法就相近的方法,它的第一个参数用作this的对象,其他参数都直接传递给函数自身.
function sayName(perfix) 
{ 
alert(perfix+this.name); 
} 
obj= new Object(); 
obj.name="hero"; 
sayName.call(obj,"hello," ); 
function classA(name) 
{ 
this.name=name; 
this.showName=function(){alert(this.name);}; 
} 
function classB(name) 
{ 
classA.call(this,name); 
} 
objB = new classB("bing"); 
objB.showName();////说明classB继承classA的showName方法

3.apply()方法
aplly()方法有2个参数,一个用作this对象,一个使传递给函数的参数数组.
function sayName(perfix) 
{ 
alert(perfix+this.name); 
} 
obj= new Object(); 
obj.name="hero"; 
sayName.aplly(obj,new Array("hello,") );

4. 原型链
prototype对象的任何属性和方法都会被传递给对应类的所有实例,原型链就是用这种方式来显现继承.
function classA (){} 
classA.prototype.name="hero"; 
classA.prototype.showName=function(){alert(this.name)} 
function classB(){} 
classB.prototype=new classA(); 
objb = new classB() 
objb.showName();//print hero 说明b继承了a的方法

这里需要注意 调用classA的构造函数时,没有给它传递参数,这是原型链的标准做法,确保函数的构造函数没有任何参数.
并且 子类的所有属性和方法,必须出现在prototype属性被赋值后,应为在它之前赋的值会被删除.因为对象的prototype属性被替换成了新对象,添加了新方法的原始对象将被销毁.

5 混和方式
就是用冒充方式 定义构造函数属性,用原型法定义对象方法.

function classA(name) 
{ 
this.name=name; 
} 
classA.prototype.showName=function(){alert(this.name)} 
function classB(name) 
{ 
classA.call(this,name); 
} 
classB.prototype = new classA(); 
classB.prototype.showName1=function(){alert(this.name+"*****");}; 
obj = new classB("hero"); 
obj.showName(); 
obj.showName1();

在classB的构造函数中通过调用call方法 继承classA中的name属性,用原型链来继承classA的showName方法.
Javascript 相关文章推荐
javascript void(0)的妙用
Oct 21 Javascript
ajax请求get与post的区别总结
Nov 04 Javascript
javascript中数组的多种定义方法和常用函数简介
May 09 Javascript
JavaScript数值转换的三种方式总结
Jul 31 Javascript
javascript中call,apply,bind的用法对比分析
Feb 12 Javascript
jQuery实现鼠标滑过点击事件音效试听
Aug 31 Javascript
Bootstrap弹出带合法性检查的登录框实例代码【推荐】
Jun 23 Javascript
关于动态执行代码(js的Eval)实例详解
Aug 15 Javascript
javascript 分号总结及详细介绍
Sep 24 Javascript
bootstrap table单元格新增行并编辑
May 19 Javascript
浅谈在koa2中实现页面渲染的全局数据
Oct 09 Javascript
vue生命周期的探索
Apr 03 Javascript
JS去除字符串的空格增强版(可以去除中间的空格)
Aug 26 #Javascript
JavaScript 获取用户客户端操作系统版本
Aug 25 #Javascript
JS 获取span标签中的值的代码 支持ie与firefox
Aug 24 #Javascript
jquery 表单进行客户端验证demo
Aug 24 #Javascript
JS 时间显示效果代码
Aug 23 #Javascript
JQuery this 和 $(this) 的区别
Aug 23 #Javascript
ext checkboxgroup 回填数据解决
Aug 21 #Javascript
You might like
怎样去阅读一份php源代码
2009/08/21 PHP
PHP Class&Object -- 解析PHP实现二叉树
2013/06/25 PHP
PHP代码优化之成员变量获取速度对比
2014/02/28 PHP
php给每个段落添加空格的方法
2015/03/20 PHP
php生成不重复随机数、数组的4种方法分享
2015/03/30 PHP
在thinkphp5.0路径中实现去除index.php的方式
2019/10/16 PHP
NodeJS学习笔记之Connect中间件模块(二)
2015/01/27 NodeJs
jQuery多个input求和的实现方法
2015/02/12 Javascript
详解Javascript中的Object对象
2016/02/28 Javascript
vue2.0多条件搜索组件使用详解
2020/03/26 Javascript
写给vue新手们的vue渲染页面教程
2017/09/01 Javascript
JavaScript实现单英文金山打字通
2020/07/24 Javascript
在vue中使用jsx语法的使用方法
2019/09/30 Javascript
Bootstrap简单实用的表单验证插件BootstrapValidator用法实例详解
2020/03/29 Javascript
python正则表达式抓取成语网站
2013/11/20 Python
python海龟绘图实例教程
2014/07/24 Python
Python保存MongoDB上的文件到本地的方法
2016/03/16 Python
对python遍历文件夹中的所有jpg文件的实例详解
2018/12/08 Python
在Python中过滤Windows文件名中的非法字符方法
2019/06/10 Python
python-Web-flask-视图内容和模板知识点西宁街
2019/08/23 Python
python 默认参数相关知识详解
2019/09/18 Python
css3加js做一个简单的3D行星运转效果实例代码
2017/01/18 HTML / CSS
html5 拖拽上传图片实例演示
2013/04/01 HTML / CSS
HTML5组件Canvas实现图像灰度化(步骤+实例效果)
2013/04/22 HTML / CSS
理肤泉俄罗斯官网:La Roche-Posay俄罗斯
2018/07/24 全球购物
南京某软件公司的.net面试题
2015/11/30 面试题
顶撞老师检讨书
2014/02/07 职场文书
大学生入党推荐书范文
2014/05/17 职场文书
建筑安全标语
2014/06/07 职场文书
五一劳动节演讲稿
2014/09/12 职场文书
学生逃课检讨书1000字
2014/10/20 职场文书
2014年前台接待工作总结
2014/12/05 职场文书
幼儿园园长新年寄语2015
2014/12/08 职场文书
golang判断key是否在map中的代码
2021/04/24 Golang
Python中json.dumps()函数的使用解析
2021/05/17 Python
Python之Matplotlib绘制热力图和面积图
2022/04/13 Python