JavaScript中B继承A的方法
js继承有5种实现方式:
1、继承第一种方式:对象冒充
function Parent(username){
this.username = username;
this.hello = function(){
alert(this.username);
}
}
function Child(username,password){
//通过以下3行实现将Parent的属性和方法追加到Child中,从而实现继承
//第一步:this.method是作为一个临时的属性,并且指向Parent所指向的对象,
//第二步:执行this.method方法,即执行Parent所指向的对象函数
//第三步:销毁this.method属性,即此时Child就已经拥有了Parent的所有属性和方法
this.method = Parent;
this.method(username);//最关键的一行
delete this.method;
this.password = password;
this.world = function(){
alert(this.password);
}
}
var parent = new Parent("zhangsan");
var child = new Child("lisi","123456");
parent.hello();
child.hello();
child.world();
2、继承第二种方式:call()方法方式
call方法是Function类中的方法
call方法的第一个参数的值赋值给类(即方法)中出现的this
call方法的第二个参数开始依次赋值给类(即方法)所接受的参数
function test(str){
alert(this.name + " " + str);
}
var object = new Object();
object.name = "zhangsan";
test.call(object,"langsin");//此时,第一个参数值object传递给了test类(即方法)中出现的this,而第二个参数"langsin"则赋值给了test类(即方法)的str
function Parent(username){
this.username = username;
this.hello = function(){
alert(this.username);
}
}
function Child(username,password){
Parent.call(this,username);
this.password = password;
this.world = function(){
alert(this.password);
}
}
var parent = new Parent("zhangsan");
var child = new Child("lisi","123456");
parent.hello();
child.hello();
child.world();
3、继承的第三种方式:apply()方法方式
apply方法接受2个参数,
A、第一个参数与call方法的第一个参数一样,即赋值给类(即方法)中出现的this
B、第二个参数为数组类型,这个数组中的每个元素依次赋值给类(即方法)所接受的参数
function Parent(username){
this.username = username;
this.hello = function(){
alert(this.username);
}
}
function Child(username,password){
Parent.apply(this,new Array(username));
this.password = password;
this.world = function(){
alert(this.password);
}
}
var parent = new Parent("zhangsan");
var child = new Child("lisi","123456");
parent.hello();
child.hello();
child.world();
4、继承的第四种方式:原型链方式,即子类通过prototype将所有在父类中通过prototype追加的属性和方法都追加到Child,从而实现了继承
function Person(){
}
Person.prototype.hello = "hello";
Person.prototype.sayHello = function(){
alert(this.hello);
}
function Child(){
}
Child.prototype = new Person();//这行的作用是:将Parent中将所有通过prototype追加的属性和方法都追加到Child,从而实现了继承
Child.prototype.world = "world";
Child.prototype.sayWorld = function(){
alert(this.world);
}
var c = new Child();
c.sayHello();
c.sayWorld();
5、继承的第五种方式:混合方式
混合了call方式、原型链方式
function Parent(hello){
this.hello = hello;
}
Parent.prototype.sayHello = function(){
alert(this.hello);
}
function Child(hello,world){
Parent.call(this,hello);//将父类的属性继承过来
this.world = world;//新增一些属性
}
Child.prototype = new Parent();//将父类的方法继承过来
Child.prototype.sayWorld = function(){//新增一些方法
alert(this.world);
}
var c = new Child("zhangsan","lisi");
c.sayHello();
c.sayWorld();
转载于:https://www.cnblogs.com/fwei/p/6475973.html
JavaScript中B继承A的方法相关推荐
- JavaScript中的继承入门
正统的面相对象的语言都会提供extend之类的方法用于出来类的继承,但Javascript并不提供extend方法,在Javascript中使用继承需要用点技巧. Javascript中的实例的属性和 ...
- JavaScript学习13 JavaScript中的继承
JavaScript学习13 JavaScript中的继承 继承第一种方式:对象冒充 <script type="text/javascript">//继承第一种方式: ...
- javascript中的继承方式
javascript中的继承方式有好几种. 下面分别举例供大家参考学习: 1.function parent() { this.x=1; } function child() { var instan ...
- 什么是在JavaScript中扩展错误的好方法?
本文翻译自:What's a good way to extend Error in JavaScript? I want to throw some things in my JS code and ...
- JavaScript中es5继承(call、apply)和es6继承(super)
欢迎加入qq群(IT-程序猿-技术交流群):757345416 今天我们来研究下JavaScript中的继承: es5: //构造器函数 function Person(name,age,sex){t ...
- 02.Javascript中的继承----Inherits
02.Javascript中的继承----Inherits 本文不再过多的阐述OOP中继承的概念,只是用原生的Javascript代码来模拟类继承(不是对象扩展) 类继承:inherits 假设有已定 ...
- php节点对象,JavaScript_JavaScript中访问节点对象的方法有哪些如何使用,JavaScript中访问节点对象的方法 - phpStudy...
JavaScript中访问节点对象的方法有哪些如何使用 JavaScript中访问节点对象的方法有哪些? var obj = document.getElementById('fdafda'); va ...
- 在JavaScript中复制数组的最快方法-切片与“ for”循环
本文翻译自:Fastest way to duplicate an array in JavaScript - slice vs. 'for' loop In order to duplicate a ...
- java中字符串和数组如何比较_[Java教程]javascript中数组和字符串的方法比较
[Java教程]javascript中数组和字符串的方法比较 0 2016-07-19 23:00:05 ×目录[1]可索引 [2]转换 [3]拼接[4]创建[5]位置 前面的话 字符串和数组有很多的 ...
- JavaScript中的 inludes 和 indexOf 方法 | 判断字符串或数组中是否存在对应的元素| 相同点与不同点 | 代码详解
目录 JavaScript中的inludes和indexOf方法 1.数组中的includes和indexOf方法比较 1.1 函数返回值的不同 1.2 函数第二个参数--开始查找的位置 1.3 in ...
最新文章
- pycharm波浪线检查去掉
- Delphi Form Designer (窗体设计器)之四
- SSE eventSource简介
- 交互设计师到底是干嘛的
- 北斗三号b1c频点带宽_【导航论坛】北斗三号卫星导航信号及接收策略
- 作者:张广艳,男,博士,清华大学计算机科学与技术系副教授,中国计算机学会会员。...
- matlab常用函数通俗解释(fft2和fftshift函数设置问题等)
- Android 得到函数耗时多少的方法
- 垃圾收集(GC)中如何确定哪些内存是垃圾
- 41. 后台模块开发(6)
- Ubuntu 离线安装软件包
- 从零打造的机械(智能)键盘,超级喜欢,IT人最爱
- 跨境电商亚马逊最新骗局揭秘:所谓的跨境电商亚马逊店铺真的能赚钱吗?真的靠谱?
- R-南丁格尔玫瑰图: 仿制效果最好的疫情玫瑰图
- 东软始业教育2021(注意看得分88分)
- Apache Log4j使用实例
- Java 丢手绢游戏 求和_大班游戏活动_丢手绢
- ibm x3650 m2服务器维修手册,ibm x3650 m2服务器的详细配置资料.doc
- 全面解析人、机、料、法、环,请收好
- linux网络流量控制,linux 下网络流量监控
热门文章
- 微信小游戏 - 理论介绍 - 账号注册 - 开发前准备
- motion blur matlab,Motion Blur app
- 小D课堂-SpringBoot 2.x微信支付在线教育网站项目实战_5-2.微信扫一扫功能开发前期准备...
- 阶段3 1.Mybatis_01.Mybatis课程介绍及环境搭建_04.mybatis概述
- 跨域请求的两种实现方式
- linux操作命令之压缩命令
- Selenium TestNG Java环境搭建过程中所遇问题汇总
- codeforces 597C (树状数组+DP)
- flash无法注册控件
- android文件关联之mime type