在JavaScript中没有Java中的exends关键字,只能通过其他的方式来实现继承关系。

1) 对象冒充

 1 function Parent(username)
 2 {
 3     this.username = username;
 4
 5     this.sayHello = function()
 6     {
 7         alert(this.username);
 8     }
 9 }
10
11 function Child(username, password)
12 {
13     //下面三行代码是就是实现了Child继承Parent的关键代码
14     this.method = Parent;
15     this.method(username);
16     delete this.method;
17
18     this.password = password;
19
20     this.sayWorld = function()
21     {
22         alert(this.password);
23     }
24 }
25
26 var parent = new Parent("zhangsan");
27 var child = new Child("lisi", "1234");
28 parent.sayHello();
29 child.sayHello();
30 child.sayWorld();

2) call方法方式。
call方法是Function对象中的方法,因此我们定义的每个函数都拥有该方法。可以通过函数名来调用call方法,call方法的第一个参数会被传递给函数中的this,从第2个参数开始,逐一赋值给函数中的参数。

 1 //使用call方式实现对象的继承
 2
 3 function Parent(username)
 4 {
 5     this.username = username;
 6
 7     this.sayHello = function()
 8     {
 9         alert(this.username);
10     }
11 }
12
13 function Child(username, password)
14 {
15         //下面的一行代码是第一种方式三行关键代码的替换
16     Parent.call(this, username);
17
18     this.password = password;
19
20     this.sayWorld = function()
21     {
22         alert(this.password);
23     }
24 }
25
26 var parent = new Parent("zhangsan");
27
28 var child = new Child("lisi", "123");
29
30 parent.sayHello();
31
32 child.sayHello();
33 child.sayWorld();        

3) apply方法方式

 1 //使用apply方法实现对象继承
 2 function Parent(username)
 3 {
 4     this.username = username;
 5
 6     this.sayHello = function()
 7     {
 8         alert(this.username);
 9     }
10 }
11
12 function Child(username, password)
13 {
14     Parent.apply(this, new Array(username));
15
16     this.password = password;
17
18     this.sayWorld = function()
19     {
20         alert(this.password);
21     }
22 }
23
24 var parent = new Parent("zhangsan");
25 var child = new Child("lisi", "123");
26
27 parent.sayHello();
28
29 child.sayHello();
30 child.sayWorld();

4)原型链方式(无法给构造函数传参数)

 1 function Parent()
 2 {
 3
 4 }
 5
 6 Parent.prototype.hello = "hello";
 7 Parent.prototype.sayHello = function()
 8 {
 9     alert(this.hello);
10 }
11
12 function Child()
13 {
14
15 }
16
17 Child.prototype = new Parent();
18
19 Child.prototype.world = "world";
20 Child.prototype.sayWorld = function()
21 {
22     alert(this.world);
23 }
24
25 var child = new Child();
26
27 child.sayHello();
28 child.sayWorld();

5)混合方式(推荐)

 1 function Parent(hello)
 2 {
 3     this.hello = hello;
 4 }
 5
 6 Parent.prototype.sayHello = function()
 7 {
 8     alert(this.hello);
 9 }
10
11 function Child(hello, world)
12 {
13     Parent.call(this, hello);
14
15     this.world = world;
16 }
17
18 Child.prototype = new Parent();
19
20 Child.prototype.sayWorld = function()
21 {
22     alert(this.world);
23 }
24
25 var child = new Child("hello", "world");
26
27 child.sayHello();
28 child.sayWorld();

转载于:https://www.cnblogs.com/daneres/p/4787543.html

JavaScript中的继承相关推荐

  1. JavaScript中的继承入门

    正统的面相对象的语言都会提供extend之类的方法用于出来类的继承,但Javascript并不提供extend方法,在Javascript中使用继承需要用点技巧. Javascript中的实例的属性和 ...

  2. JavaScript学习13 JavaScript中的继承

    JavaScript学习13 JavaScript中的继承 继承第一种方式:对象冒充 <script type="text/javascript">//继承第一种方式: ...

  3. javascript中的继承方式

    javascript中的继承方式有好几种. 下面分别举例供大家参考学习: 1.function parent() { this.x=1; } function child() { var instan ...

  4. JavaScript中es5继承(call、apply)和es6继承(super)

    欢迎加入qq群(IT-程序猿-技术交流群):757345416 今天我们来研究下JavaScript中的继承: es5: //构造器函数 function Person(name,age,sex){t ...

  5. 02.Javascript中的继承----Inherits

    02.Javascript中的继承----Inherits 本文不再过多的阐述OOP中继承的概念,只是用原生的Javascript代码来模拟类继承(不是对象扩展) 类继承:inherits 假设有已定 ...

  6. 总结JavaScript中的继承

    看了<JavaScript高级程序设计>,以自己的方式总结一下继承的内容. 书中关于继承讲了6小节内容,分为原型链.借用构造函数.组合继承.原型式继承.寄生式继承及寄生组合式继承. 其他代 ...

  7. JavaScript 中的继承(读书笔记思维导图)

    继承是 OO 语言中的一个最为人津津乐道的概念.许多 OO 语言都支持两种继承方式:接口继承和实现继承.接口继承只继承方法签名,而实现继承则继承实际的方法.由于函数没有签名,在 ECMAScript ...

  8. JavaScript中实现继承的方法(深入学习原型链、盗用构造函数、组合继承、原型式继承、寄生式继承、寄生式组合继承)

    一.原型链 原型链的基本思想就是通过原型继承多个引用类型的属性和方法. 构造函数.原型和实例的关系:每个构造函数都有一个原型对象,原型有一个属性指回构造函数,而实例有一个内部指针指向原型. 若原型是另 ...

  9. 详细解析JavaScript中的继承(包括组合继承和寄生式继承)

    继承:相信很多学习过Java等面向对象语言的同学,都会接触过继承,它们实现继承的主要方式是接口继承和实现继承.但由于JavaScript函数没有签名,所以无法实现接口继承.ECMAScript支持实现 ...

最新文章

  1. 由于目标机器积极拒绝,无法联接。microsoft sql server,错误:10061
  2. iptables基础——链与表
  3. 浪漫的html表白源代码_Love:程序猿的方式【情人节amp;520—我爱你】动画加音效 → 那些年最浪漫的表白(帮你得到你的她)...
  4. Docker使用国内镜像仓库
  5. Luogu_2774 方格取数问题
  6. CloseableHttpClient加载证书来访问https网站
  7. VS2010/MFC编程入门之四(MFC应用程序框架分析)
  8. 深度学习之循环神经网络(2)循环神经网络原理
  9. 不知道输入何时停止_知道何时停止
  10. python requirements.txt_python_requirements.txt使用
  11. 3d打印英语文献_利用三维扫描,3D打印,复模和铸造,数字化复制佛罗伦萨洗礼堂北门...
  12. fid fopen MATLAB
  13. 按键精灵 excel mysql_按键精灵常用插件介绍
  14. RAID5换硬盘重建记录
  15. SAS中的intnx函数
  16. IDEA 2020.1.2 无法显示图片的魔幻解决方法
  17. 利用keras搭建基础模型莺尾花
  18. 我准备报名上海芭蕾舞学校了
  19. 动态规划——什么是动态规划?
  20. android adb:电池与电量

热门文章

  1. HDU-2444 The Accomodation of Students
  2. leetcode valid number
  3. jQuery Masonry 一个 jQuery动态网格布局的插件
  4. 内存溢出原因及解决方案
  5. SVN commit:remains in tree-conflict错误的解决办法
  6. IT人的理性、激情与爱情
  7. CV_CAST_8U(val);的意义
  8. DPDK uio驱动实现(二十)
  9. TIME_WAIT和CLOSE_WAIT状态
  10. 阿里云ubuntu14.04下lamp环境搭建の备忘