`
mabusyao
  • 浏览: 252727 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

javascript中如何模拟继承机制

阅读更多
构造函数使用this关键字给所有属性和方法赋值,因为构造函数仅仅是一个普通函数,因此可以使ClassA的构造函数成为ClassB的方法,然后调用它。ClassB会收到ClassA的构造函数中定义的属性和方法。

很抽象的一段话,具体的实现应该是什么样子的呢? 我们先看一段简单的代码:
function ClassA(sColor) {
  this.color = sColor;
  this.printColor = function() {alert(this.color);}
}

function ClassB(){
}


this所指向的是构造函数当前创建的对象, 但是在这里,我们应当把ClassA这个函数本身就看作是对象,而this就是指向ClassA的。

因此,这里的ClassA应该是常规的函数(this所指向的), 而不再是构造函数。

下面这段代码改写了ClassB,实现了所谓的继承:

function ClassB(sColor){
  this.newMethod = ClassA;
  this.newMethod(sColor);
  delete this.newMethod;
}


在这里,我们首先为ClassB 创建了一个新的方法newMethod,并将其指向ClassA(记住ClassA只是个普通的方法), 然后调用这个方法。 最后再将其删去。

!
还记得ClassA方法里面的this么? 现在它指向谁了?想明白了这个道理,你就能明白为什么下面的代码可行了:


var objB = new ClassB("sColor");
objB.printColor();//print sColor;


这种方式太过于流行,以至于ECMA决定为此添加两个新的方法,即call() 和apply()。

call()方法的第一个参数用作this的对象引用,而后面的参数则保持不变:
function ClassB(sParam){
  alert(this.sColor);
  alert(sParam);
}

var obj = new Object();
obj.sColor = "red";

ClassB.call(obj, "yes");


第一个参数说明了由谁来调用ClassB,即决定了this的属性。

利用call()方法,上面的代码就可以改写成:
function ClassB(sColor){
  ClassA.call(this, sColor);
}


apply跟call函数很接近,第一个参数是要调用的对象,而第二个函数则是要传递参数的数组。 其他的基本一致。

其实即使我们不采用模拟继承的方式,apply和call函数也是非常好用的。具体怎么使用,就看程序的需求了。

最后一种方法,不同于之前的所有办法,采用了覆盖prototype的方式:
function ClassA(){
}

function ClassB(){
}

ClassB.prototype = new ClassA();


这种方式的好处的,如果你使用instanceof方法,会发现ClassB的实例类型也是ClassA。
缺点则是,构造函数不能有参数。
分享到:
评论

相关推荐

    JavaScript继承

    与其他面向对象语言相比,JavaScript的继承机制更为复杂。在Java或C++等语言中,继承通常只需要一个关键字,如`extends`,但在JavaScript中,实现继承需要采用一系列技术。 JavaScript使用的是原型式继承,这是它与...

    JavaScript中的类继承

    这种继承机制使得JavaScript具有更强的表现力和灵活性,尤其在代码复用和类型安全方面。 类型安全和代码复用是类继承的主要原因。在强类型语言中,类型转换是必要的,以确保数据在不同类型的变量间正确传递。然而,...

    javascript的prototype继承

    JavaScript的原型继承是其面向对象编程的一大特性,它基于原型链机制实现,允许一个对象可以从另一个对象继承属性和方法。这种继承方式不同于类继承,而是通过将子类的原型对象设置为父类的一个实例来实现。 在...

    在JavaScript中模拟类(class)及类的继承关系_.docx

    在JavaScript中,尽管ES6之前其语法并不直接支持类(class)的概念,但开发者通过不同的方式模拟了类的实现和继承机制。以下是三种常见的模拟类和实现继承的方法: 1. **构造函数法**: 构造函数是JavaScript中...

    javascript中类和继承(代码示例+prototype.js)

    JavaScript的类和继承机制是其面向对象特性的重要组成部分。通过函数构造器、原型链以及`prototype.js`文件中可能提供的类和继承工具,我们可以创建复杂的对象结构和组织代码。理解并掌握这些概念有助于提升...

    JavaScript继承与多继承实例分析.docx

    JavaScript的继承机制主要基于原型链,本文将深入探讨JavaScript的继承与多继承,并通过实例进行分析。 1. **JavaScript继承** - **原理**:JavaScript的继承主要是通过原型链(prototype chain)来实现的。每个...

    JavaScript中的原型继承基础学习教程_.docx

    在JavaScript中,原型继承是一种核心机制,用于实现面向对象编程中的继承特性。与其他许多编程语言不同,JavaScript不使用类来实现继承,而是基于原型(prototype)的概念。本文将深入探讨JavaScript中的原型继承...

    JavaScript 继承详解(六)

    Prototype.js是一个早期的JavaScript库,它为JavaScript提供了类和继承的模拟,使得在JavaScript中实现面向对象编程变得更加方便。 在早期的Prototype.js版本中,继承的实现相对简单。`Class.create`函数被用来创建...

    Javascript类的继承,使用this.callParent调用超类方法

    这些框架通过扩展JavaScript的继承机制,提供了更强大的类系统和方法调用链,使得开发大型复杂应用变得更加容易。 总结一下,JavaScript的类继承是通过构造函数、原型链和实例化来实现的。`this.callParent`方法...

    javascript用函数实现继承详解javascript技巧docx.docx

    在JavaScript中,可以使用多种方式来实现继承,其中之一就是通过函数来模拟继承。本文将详细介绍如何利用函数实现JavaScript的继承,并结合属性特性和描述符来深入理解这一过程。 首先,我们要了解JavaScript中的...

    javascript继承机制实例详解

    在深入探讨JavaScript继承机制之前,我们需要先了解JavaScript中的继承是如何实现的,以及它与传统面向对象语言如ActionScript3中继承的区别。JavaScript是一种基于原型的语言,这意味着它没有像其他语言中的类和...

    javaScript面向对象继承方法经典实现.docx

    JavaScript没有类,但可以通过原型(prototype)机制来实现继承。以下是两种经典的JavaScript面向对象继承方法的详细解释: 1. **基于原型的继承**: 这种方法是JavaScript最基础的继承方式,通过`prototype`属性...

    Javascript继承机制详解

    JavaScript的继承机制是其动态类型语言特性的重要组成部分,它提供了多种实现方式来模拟面向对象编程中的继承概念。本文主要探讨两种常见的继承实现:对象冒充和原型方式。 1. **对象冒充**: 对象冒充是一种通过...

    Javascript中3种实现继承的方法和代码实例_.docx

    总结来说,JavaScript中的继承机制虽然没有像其他面向对象语言那样直接,但通过对象冒充、原型继承和混合继承等方式,开发者可以有效地实现代码复用和面向对象的设计。在实际应用中,应根据项目需求选择合适的继承...

    JavaScript设计模式中文版第4章-继承.pdf

    JavaScript设计模式中的继承机制是其面向对象编程的重要组成部分。继承允许子类继承父类的属性和方法,从而减少代码重复并提高代码复用性。在JavaScript中,继承并不像Java或C++等语言那样简单地使用一个关键字,...

    JavaScript中的继承方式详解

    JavaScript中的继承机制是其面向对象编程的核心特性之一。在JavaScript中,继承主要通过两种方式实现:原型链继承和类式继承。这两种方式并不是孤立存在的,它们经常被组合使用以达到更灵活的继承效果。 首先,我们...

    JavaScript 继承的实现

    总的来说,JavaScript的继承机制是通过构造函数和原型来实现的,它提供了一种灵活的方式来模拟面向对象的特性,使得开发者能够在JavaScript环境中实现类似于类和继承的功能。虽然这种方法与传统的面向对象语言有所...

    在JavaScript中模拟类(class)及类的继承关系

    了解这一点对于深入理解JavaScript的继承机制至关重要。 总的来说,无论是模拟类还是实现继承,在JavaScript中都有多种方法可供选择。传统方法、ES5方法和ES6中的新特性各有千秋,选择合适的方法取决于具体的使用...

    详解JavaScript基于面向对象之继承

    在JavaScript(ECMAScript)中,继承机制是通过多种方式实现的,包括但不限于原型链、构造函数借用、组合继承等。JavaScript的类并非传统意义上的类,而是通过函数来模拟的。当一个函数被用作构造函数时,它可以创建...

Global site tag (gtag.js) - Google Analytics