`
nbkangta
  • 浏览: 431614 次
  • 性别: Icon_minigender_1
  • 来自: 宁波
社区版块
存档分类
最新评论

javascript的prototype继承

    博客分类:
  • JS
阅读更多

基本的用法 把ClassA的一个实例赋值给ClassB ClassB就继承了ClassA的所有属性

<script>
function ClassA()
{
    
this.a='a';
}

function ClassB()
{
    
this.b='b';
}

ClassB.prototype
=new ClassA();
var objB=new ClassB();
for(var p in objB)document.write(p+"<br>");
</script>



从原型继承理论的角度去考虑 js的原型继承是引用原型 不是复制原型
所以 修改原型会导致所有B的实例的变化

<script>
function ClassA()
{
    
this.a='a';
}

function ClassB()
{
    
this.b='b';
}

ClassB.prototype
=new ClassA();
var objB=new ClassB();
alert(objB.a);
ClassB.prototype.a
='changed!!';
alert(objB.a);
</script>



然而 子类对象的写操作只访问子类对象中成员 它们之间不会互相影响
因此 写是写子类 读是读原型(如果子类中没有的话)

<script>
function ClassA()
{
    
this.a='a';
}

function ClassB()
{
    
this.b='b';
}

ClassB.prototype
=new ClassA();
var objB1=new ClassB();
var objB2=new ClassB();
objB1.a
='!!!';
alert(objB1.a);
alert(objB2.a);
</script>



每个子类对象都执有同一个原型的引用 所以子类对象中的原型成员实际是同一个

<script>
function ClassA()
{
    
this.a=function(){alert();};
}

function ClassB()
{
    
this.b=function(){alert();};
}

ClassB.prototype
=new ClassA();
var objB1=new ClassB();
var objB2=new ClassB();
alert(objB1.a
==objB2.a);
alert(objB1.b
==objB2.b);
</script>




构造子类时 原型的构造函数不会被执行

<script>
function ClassA()
{
    alert(
"a");
    
this.a=function(){alert();};
}

function ClassB()
{
    alert(
"b");
    
this.b=function(){alert();};
}

ClassB.prototype
=new ClassA();
var objB1=new ClassB();
var objB2=new ClassB();
</script>



接下来是致命的,在子类对象中访问原型的成员对象:

<script>
function ClassA()
{
    
this.a=[];
}

function ClassB()
{
    
this.b=function(){alert();};
}

ClassB.prototype
=new ClassA();
var objB1=new ClassB();
var objB2=new ClassB();
objB1.a.push(
1,2,3);
alert(objB2.a);
//所有b的实例中的a成员全都变了!!
</script>



所以 在prototype继承中 原型类中不能有成员对象! 所有成员必须是值类型数据(string也可以)

用prototype继承有执行效率高,不会浪费内存,为父类动态添置方法后子类中马上可见等的优点。

我就非常喜欢用prototype继承。

prototype继承是通过把子类的原型对象(prototype)设置成父类的一个实例来进行继承的。

只简单的这样设置继承的确如楼主所说,有不少缺点。总的来说有四个缺点:

  缺点一:父类的构造函数不是像JAVA中那样在给子类进行实例化时执行的,而是在设置继承的时候执行的,并且只执行一次。这往往不是我们希望的,特别是父类的构造函数中有一些特殊操作的情况下。

  缺点二:由于父类的构造函数不是在子类进行实例化时执行,在父类的构造函数中设置的成员变量到了子类中就成了所有实例对象公有的公共变量。由于JavaScript中继承只发生在“获取”属性的值时,对于属性的值是String,Number和Boolean这些数据本身不能被修改的类型时没有什么影响。但是Array和Object类型就会有问题。
  缺点三:如果父类的构造函数需要参数,我们就没有办法了。

  缺点四:子类原本的原型对象被替换了,子类本身的constructor属性就没有了。在类的实例取它的constructor属性时,取得的是从父类中继承的constructor属性,从而constructor的值是父类而不是子类。


我也曾经为了这四个缺点头疼过,于是对prototype继承进行改造。
我试了几种方法,下面是我觉得最好的一种。我把它写成Function对象的一个方法,这样用的时候方便。方法如下:

//类的继承-海浪版
Function.prototype.Extends = function (parentClass)
{
  
var Bs = new Function();
  Bs.prototype 
= parentClass.prototype;
  
this.prototype = new Bs();
  
this.prototype.Super = parentClass;
  
this.prototype.constructor = this;
}
分享到:
评论

相关推荐

    JavaScript类和继承 prototype属性

    我们已经在第一章中使用prototype属性模拟类和继承的实现。 prototype属性本质上还是一个JavaScript对象。 并且每个函数都有一个默认的prototype属性。 如果这个函数被用在创建自定义对象的场景中,我们称这个函数为...

    JavaScript使用prototype属性实现继承操作示例

    主要介绍了JavaScript使用prototype属性实现继承操作,结合实例形式详细分析了JavaScript使用prototype属性实现继承的相关原理、实现方法与操作注意事项,需要的朋友可以参考下

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

    本文将深入探讨JavaScript中的类和继承,并结合`prototype.js`文件中的示例进行解析。 ### 类的概念与模拟 在JavaScript中,我们通常使用函数来模拟类的行为。一个函数可以看作是一个类的定义,通过`new`关键字来...

    JavaScript的prototype

    JavaScript中的`prototype`是一个核心概念,它涉及到对象继承和函数原型。在JavaScript中,每创建一个函数,该函数就会自动获得一个名为`prototype`的属性,这个属性是一个对象,用于实现对象间的继承。同时,每个...

    不错的一篇关于javascript-prototype继承

    ### JavaScript Prototype 继承详解 #### 一、基本概念与用法 JavaScript 是一种基于原型的语言,这使得它能够以非常灵活的方式实现继承。在 JavaScript 中,可以通过将一个类的实例赋值给另一个类的 `prototype` ...

    JavaScript实现继承的几种方式

    JavaScript的原型(prototype)机制是实现继承的基础。每个函数都有一个prototype属性,这个属性指向一个对象,这个对象的属性和方法可以被实例共享。通过将一个对象设置为另一个对象的原型,我们可以实现继承。 ``...

    javascript类库prototype.js

    6. **Class与Object继承**:Prototype.js 引入了面向对象的概念,实现了类(Class)和对象继承,使得JavaScript具备了更接近传统面向对象语言的编程模式。 7. **JSON支持**:随着JSON成为数据交换的主流格式,...

    JavaScriptprototype的深度探索不是原型继承那么简单.pdf

    JavaScriptprototype的深度探索不是原型继承那么简单.pdf

    Advanced JavaScript (closures,prototype,inheritance)

    JavaScript,作为一种广泛应用于Web开发的脚本语言,其高级特性如闭包(closures)、原型(prototype)和继承(inheritance)是理解其精髓的关键。本文将深入探讨这些概念,帮助开发者更好地掌握JavaScript的核心。 ...

    javascript prototype文档.rar

    JavaScript中的原型(Prototype)是理解JavaScript继承机制的关键概念。它是一种对象属性,允许一个对象访问并继承另一个对象的属性和方法。在这个“javascript prototype文档”中,我们可以期待深入学习JavaScript...

    JavaScript继承

    原型(Prototype)是JavaScript实现继承的基础,每个对象都有一个`__proto__`属性,指向创建它的构造函数的原型对象。通过原型,子类可以共享父类的属性和方法,减少了代码的重复。此外,JavaScript的灵活性允许...

    JavaScript学习之三 — JavaScript实现继承的7种方式

    本篇文章将深入探讨JavaScript实现继承的七种常见方式,帮助你更好地理解和运用这一概念。 1. 原型链继承(Prototype Chain Inheritance) 原型链是JavaScript实现继承的基础。每个函数都有一个`prototype`属性,这...

    JavaScript_Prototype(源代码+中文手册).rar

    JavaScript Prototype 是一种重要的编程概念,尤其在Web开发中不可或缺。这个压缩包文件“JavaScript_Prototype(源代码+中文手册).rar”包含了关于JavaScript原型的源代码和中文手册,为学习和理解这一主题提供了...

    javascript prototype原型操作笔记.docx

    **Prototype** 在 JavaScript 中是一个非常重要的概念,它支持面向对象编程中的继承特性。每个 JavaScript 对象都有一个内部属性 `[[Prototype]]`,它链接到另一个对象,即原型对象。当我们尝试访问一个对象的属性...

    javascript控件开发之继承关系

    在JavaScript中,继承是基于原型(prototype)的机制。每个JavaScript对象都有一个内部[[Prototype]]链接到另一个对象,这通常是其构造函数的prototype属性。通过这种方式,一个对象可以“继承”另一个对象的属性和...

    理解Javascript原型继承原理

    通过以上分析,我们可以看到,在JavaScript中,通过`prototype`和`[[Prototype]]`实现了非常灵活的继承机制。这种机制允许我们轻松地扩展和重用现有对象的功能,同时也使得JavaScript成为一种非常适合面向对象编程的...

    javascript原型继承代码案例

    javascript原型继承,prototype的使用,可以像java一样继承

    Prototype

    5. **类与对象**:Prototype 引入了类的概念,通过Class.create()方法可以创建自定义类,并支持继承、构造函数、方法覆盖等面向对象特性。 ### 二、Prototype 使用示例 1. **DOM操作示例**: ```javascript var ...

Global site tag (gtag.js) - Google Analytics