推荐JavaScript实现继承的最佳方式

实现JavaScript继承的最简单的方式是call方法（或者apply方法）及原型链方法，但这两种方法都有缺陷，而其混合体就是很好的继承实现方式。下面举例说明：

代码如下:

function Animal(age){
    this.age = age;
}
Animal.prototype.sayAge = function(){
    window.alert("My age is "+this.age+"!");
};
function Dog(age,name){
    Animal.call(this,age);
    this.name = name;
}
Dog.prototype = new Animal();
Dog.prototype.sayName = function(){
    window.alert("I am a "+this.name+"!");
};
var dog = new Dog(15,"dog");
dog.sayName();
dog.sayAge();

对于类Animal来说，它有一个字段属性age及函数属性sayAge，sayAge方法的定义采用的是原型方式。Dog类要继承Animal，其字段属性除了age外还有name，通过Animal.call(this,age);可以实现Dog继承Animal的字段属性age并将其初始化了。call方法的第一个参数为继承的类的this指针，第二个参数为Animal类的构造函数的参数。实际上，只是通过call方法就可以实现继承，但唯一的要求是父类的函数属性要在构造函数中定义，这对于这里的函数属性使用原型方式定义来说就不适合了（采用原型方式定义函数属性比在构造函数内定义更直观一些）。要想继承Animal的原型方式定义的函数属性，需要的语句就是“Dog.prototype = new Animal();”。而Dog类中的sayName()函数则是其自身的函数属性了。

除了这个最经典的实现继承的方式外，目前还有一些免费的库可供使用。但想到形形色色的库，头就大了，有时间有必要时再研究吧！

赞 (0)

相关推荐

  • 采用call方式实现js继承

    复制代码 代码如下: //采用call方式实现js继承 function A(color) { this.Acolor = color; this.AshowColor = function() { document.writeln("Acolor: " + this.Acolor); } } function B(color, name) { A.call(this, color); this.Bname = name; this.BshowName = function() { d

  • js的2种继承方式详解

    js的2种继承方式详解

    js中继承可以分为两种:对象冒充和原型链方式 一.对象冒充包括三种:临时属性方式.call()及apply()方式1.临时属性方式 复制代码 代码如下: function Person(name){     this.name = name;     this.say = function(){          alert('My name is '+this.name);     }}function F2E(name,id){     this.temp = Person;     thi

  • javascript学习笔记（九）javascript中的原型(prototype)及原型链的继承方式

    javascript学习笔记（九）javascript中的原型(prototype)及原型链的继承方式

    在使用面向对象编程时,对象间的继承关系自然少不了!而原型正是实现javascript继承的很重要的一种方法! 我们首先来看以下代码: 复制代码 代码如下: function person(name, age) { this.name = name; this.age = age; } person.prototype.getInfo = function() { alert("My name is "+this.name+", and I have "+this.a

  • 实现JavaScript中继承的三种方式

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

  • JavaScript继承方式实例

    复制代码 代码如下: function parent(){ this.x=10; } function child(){ var parentObj=new parent(); for(var p in parentObj)this[p]=parentObj[p]; } var childObj=new child(); alert(childObj.x); 复制代码 代码如下: function parent(){ this.x=10; } function child(){ this.par

  • 基于JavaScript实现继承机制之构造函数+原型链混合方式的使用详解

    构造函数.原型实现继承的缺陷 首先来分析构造函数和原型链两种实现继承方式的缺陷: 构造函数(对象冒充)的主要问题是必须使用构造函数方式,且无法继承通过原型定义的方法,这不是最好的选择.不过如果使用原型链,就无法使用带参数的构造函数了.开发者如何选择呢?答案很简单,两者都用. 构造函数+原型混合方式 这种继承方式使用构造函数定义类,并非使用任何原型.创建类的最好方式是用构造函数定义属性,用原型定义方法.这种方式同样适用于继承机制,用对象冒充继承构造函数的属性,用原型链继承 prototype 对象

  • 详述JavaScript实现继承的几种方式(推荐)

    详述JavaScript实现继承的几种方式(推荐)

    ECMAScript只支持实现继承,而且其实现继承主要是依靠原型链来实现的. 原型链 原型链的基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法.每一个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个指向原型对象的指针.如果:我们让原型对象A等于另一个类型B的实例,那么原型对象A就会有一个指针指向B的原型对象,相应的B的原型对象中保存着指向其构造函数的指针.假如B的原型对象又是另一个类型的实例,那么上述的关系依旧成立,如此层层递进,就构成了实例与原型的

  • JavaScript中实现继承的三种方式和实例

    JavaScript中实现继承的三种方式和实例

    javascript虽然是一门面向对象的语言,但是它的继承机制从一开始设计的时候就不同于传统的其他面向对象语言,是基于原型的继承机制,但是在这种机制下,继承依然有一些不同的实现方式. 方法一:类式继承 所谓的类式继承就是指模仿传统面向对象语言的继承方式,继承与被继承的双方都是"类",代码如下: 首先定义一个父类(或超类): function Person(name){ this.name=name; } Person.prototype.getName=function(){ retu

  • 推荐JavaScript实现继承的最佳方式

    实现JavaScript继承的最简单的方式是call方法(或者apply方法)及原型链方法,但这两种方法都有缺陷,而其混合体就是很好的继承实现方式.下面举例说明: 复制代码 代码如下: function Animal(age){     this.age = age; } Animal.prototype.sayAge = function(){     window.alert("My age is "+this.age+"!"); }; function Dog

  • 深入讲解JavaScript之继承的多种方式和优缺点

    目录 1.原型链继承 2.借用构造函数(经典继承) 3.组合继承 4.原型式继承 5. 寄生式继承 6. 寄生组合式继承 1.原型链继承 function Parent () { this.name = 'kevin'; } Parent.prototype.getName = function () { console.log(this.name); } function Child () { } Child.prototype = new Parent(); var child1 = new

  • 谈一谈javascript中继承的多种方式

    JS 是没有继承的,不过可以曲线救国,利用构造函数.原型等方法实现继承的功能. var o=new Object(); 其实用构造函数实例化一个对象,就是继承,这里可以使用Object中的所有属性与方法.那么为什么能访问Object对象的方法,其实访问的是其原型对象的方法,所有的方法都是放在原型中而不是类中. console.log(o.__proto__ === Object.prototype) // true 继承的本质 console.log(o.__proto__ === Object

  • JavaScript是如何实现继承的(六种方式)

    前言:大多OO语言都支持两种继承方式: 接口继承和实现继承 ,而ECMAScript中无法实现接口继承,ECMAScript只支持实现继承,而且其实现继承主要是依靠 原型链 来实现. 1.原型链 基本思想:利用原型让一个引用类型继承另外一个引用类型的属性和方法. 构造函数,原型,实例之间的关系:每个构造函数都有一个原型对象,原型对象包含一个指向构造函数的指针,而实例都包含一个指向原型对象的内部指针. 原型链实现继承例子: function SuperType() { this.property

  • 一文弄懂JavaScript的继承方式

    一文弄懂JavaScript的继承方式

    目录 JavaScript中的继承方式 问:JavaScript中有几种继承方式呢 问:每种继承方式是怎么实现的呢 盗用构造函数 组合继承 原型链式继承 寄生式继承 寄生时组合继承 JavaScript中的继承方式 问:JavaScript中有几种继承方式呢 emmm...六种?五种?还是四种来着... 这次记清楚了 一共有五种继承方式 盗用构造函数 (经典继承方式 ) 组合继承 原型链式继承 寄生式继承 寄生式组合继承 问:每种继承方式是怎么实现的呢 盗用构造函数 基本思路很简单:在子类构造函

  • 学习javascript面向对象 javascript实现继承的方式

    本文实例为大家介绍了javascript实现继承的6种方式,分享给大家供大家参考,具体内容如下 1.[原型链继承]实现的本质是重写原型对象,代之以一个新类型的实例.实际上不是SubType的原型的constructor属性被重写了,而是SubType的原型指向了另一个对象--SuperType的原型,而这个原型对象的construtor属性指向的是SuperType function SuperType(){ this.property = true; } SuperType.prototype

  • 深入理解JavaScript继承的多种方式和优缺点

    写在前面 本文讲解JavaScript各种继承方式和优缺点. 注意: 跟<JavaScript深入之创建对象>一样,更像是笔记. 哎,再让我感叹一句:<JavaScript高级程序设计>写得真是太好了! 1.原型链继承 function Parent () { this.name = 'kevin'; } Parent.prototype.getName = function () { console.log(this.name); } function Child () { }

  • JavaScript 实现继承的几种方式

    非ES6代码实现继承的主流方式主要可以分为: 构造继承.原型链继承.构造继承+原型链继承组合继承.以及在组合继承上衍生出的继承方式. 构造继承 (借助call实现) 实现 function Super(age){ this.age = age; this.say = function(){ console.log(this.age) } } function Child(name,age){ Super.call(this,age) this.name = name; } var child =

随机推荐