JavaScript 实现继承的5种方式

js是一个面向对象的语言,所以具备一些面向对象的方式----------例如继承。接下来介绍5种js的继承方式.注意:js 中的函数其实是对象,函数名是对 Function 对象的引用。

1.采用call方法改变函数上下文实现继承,原理是改变函数内部的函数上下文this,使它指向传入函数的具体对象

具体代码如下

Father.call(child,child.getName) 的意思就是使用 Father对象代替child对象,child中就有 Father的所有属性和方法了,child对象就能够直接调用 Father的方法以及属性了.

2.采用apply方法改变函数上下文实现继承,原理是改变函数内部的函数上下文this,使它指向传入函数的具体对象

3.采用原型链的方式实现继承,实现原理是:使子类原型对象指向父类的实例以实现继承,即重写类的原型

这样子类就具有了父类的属性和方法,完美继承

4.使用对象冒充实现继承(该种实现方式可以实现多继承)实现原理:让父类的构造函数成为子类的方法,然后调用该子类的方法,通过this关键字给所有的属性和方法赋值

子类具有的方法和属性有   可以看出子类继承了父类的方法和属性

5.采用混合模式实现继承

时间: 2024-08-10 16:58:06

JavaScript 实现继承的5种方式的相关文章

实现JavaScript中继承的三种方式

一.原型链继承  在原型链继承方面,JavaScript与java.c#等语言类似,仅允许单父类继承.prototype继承的基本方式如下: 代码如下: function Parent(){} function Child(){} Child.prototype = new Parent(); 通过对象Child的prototype属性指向父对象Parent的实例,使Child对象实例能通过原型链访问到父对象构造所定义的属性.方法等.  构造通过原型链链接了父级对象,是否就意味着完成了对象的继承

javascript实现继承的几种方式

原型链方式实现继承 [javascript] view plain copy print? function SuperType(){ this.property = true; this.colors = ['red','blue','green']; } SuperType.prototype.getSuperValue = function(){ return this.property; }; function SubType(){ this.subprototype = false;

JavaScript实现继承的几种方式总结一

虽然在ES6中有了继承,使用extends关键字就能实现.本篇讲的不是这种,而是ES6之前的几种实现继承的方式. (一)原型链 ECMAScript中将原型链作为实现继承的主要方法.其基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法.(不理解原型链的童鞋们可以翻阅一下我之前的博客,里面有详细的说明) 实现原型链的一种基本模式 function SuperType(){ this.prototype=true; } SuperType.prototype.getSuperValue=

javascript实现继承的三种方式

一.原型链继承  function Parent(){} function Child(){} Child.prototype = new Parent(); 通过对象child的prototype属性指向父对象parent的实例,使child对象的实例通过原型链访问到父对象构造所定义的属性.方法等. 二.使用apply.call方法 js中call和apply都可以实现继承,唯一的一点参数不同,func.call(func1,var1,var2,var3)对应的apply写法为:func.ap

javascript实现继承的6种方式

/*1.原型链继承*/ function SuperType() { this.property = true; } SuperType.prototype.getSuperValue = function() { return this.property; }; function subType() { this.subProperty = false; } //继承了SuperType Subtype.prototype = new SuperType(); SubType.prototyp

javascript实现继承的一种方式

function extend(Child, Parent) { var F = function(){}; F.prototype = Parent.prototype; Child.prototype = new F(); Child.prototype.constructor = Child; Child.uber = Parent.prototype; } 使用的时候,方法如下 extend(Cat,Animal); var cat1 = new Cat("大毛","

javascript继承的两种方式

javascript继承的两种方式 1,原型链 1 <script type="text/javascript"> 2 function A() 3 { 4 this.name='a'; 5 } 6 function B() 7 { 8 9 } 10 11 12 B.prototype=new A(); 13 var obj=new B(); 14 15 alert(obj.name); 16 </script> 2,对象冒充 1 <script type

javascript中实现继承的几种方式

javascript中实现继承的几种方式 1.借用构造函数实现继承 function Parent1(){ this.name = "parent1" } function Child1(){ Parent1.call(this); this.type = "child1"; } 缺点:Child1无法继承Parent1的原型对象,并没有真正的实现继承(部分继承) 2.借用原型链实现继承 function Parent2(){ this.name = "p

javascript中构造函数的三种方式

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <script type="text/javascript"> // 创建函数的三种方式: // 1 函数声明 // 2 函数表达式 //