关于JS原型继承的问题

问题描述

function Polygon() { Polygon.prototype.getArea = function () { return 0; } } function Triangle() { Triangle.prototype = new Polygon(); } var triangle = new Triangle(); alert(triangle.getArea()); var triangle1 = new Triangle(); alert(triangle1.getArea()); 这段代码打不出东西来,如果我把alert(triangle.getArea());去掉, alert(triangle1.getArea());就可以打出来 这是为什么啊 ,也就是要在第2次实例化Triangle时才能打出来"OK". 或者代码改成如下: function Polygon() { Polygon.prototype.getArea = function () { return "OK"; } } function Triangle() { } Triangle.prototype = new Polygon(); var triangle = new Triangle(); alert(triangle.getArea()); var triangle1 = new Triangle(); alert(triangle1.getArea()); 这样就正常了,Triangle.prototype = new Polygon();这行代码写在函数里面和外面有什么区别呢 请问下这是为什么问题补充:哈哈 我就是看了这本书 就是对书上的这个解释不明白才用的但从技术上说,在代码运行前,对象已被实例化,并与原始的prototype对象联系在一起了,虽然用极晚绑定可使对原型对象的修改正确的反映出来,但替换prototype对象却不会对该对象产生任何的影响,只有对未来的对象实例才会反映出这种改变这个我不知道怎么理解

解决方案

未调用new Triangle()时,由于Triangle()中的构造函数还没有执行,所以Triganle对象的prototype并未改变。这时使用new Triangle()创建的对象,是原始的Triangle对象。而调用过一次new Triangle()后,Traingle.prototype=new Polygon()被执行。Triangle的prototype被改变了。所以再次new Triangle()创建的就是改变之后的Triangle对象。对此,楼主可以参照下面这个例子测试一下。var i=0;//标识是第几次生成的Traingle对象。function Polygon() {Polygon.prototype.getArea = function (){return "Polygon getArea()";}}function OtherPolygon() {OtherPolygon.prototype.getArea = function (){return "OtherPolygon getArea()";}}function Triangle() {if(i==0){Triangle.prototype = new Polygon();}else if(i==1){Triangle.prototype = new OtherPolygon();}i++;}Triangle.prototype.getArea = function(){return "Triangle getArea()";}var triangle1 = new Triangle();//第一次生成时,使用的是原始的prototype,结果为"Traingle getArea()",//并执行了Triangle.prototype = new Polygon();语句。alert(triangle1.getArea());var triangle = new Triangle();//第二次生成时,使用的是修改后的prototype(new Polygon()),结果为"Polygon getArea()",//并执行了Triangle.prototype = new OtherPolygon();语句。alert(triangle.getArea());var triangle = new Triangle();//第三次生成时,使用的是修改后的prototype(new OtherPolygon()),结果为"OtherPolygon getArea()",alert(triangle.getArea());
解决方案二:
直接修改prototype,不会影响他的实例,修改constructor的prototype的field才会改变实例
解决方案三:
LZ你把Triangle.prototype = new Polygon()这行代码写在构造函数里面从逻辑上讲,这个位置是正确的,但从技术上说,在代码运行前,对象已被实例化,并与原始的prototype对象联系在一起了,虽然用极晚绑定可使对原型对象的修改正确的反映出来,但替换prototype对象却不会对该对象产生任何的影响,只有对未来的对象实例才会反映出这种改变,这个是你第一个实例没有打印出来,而第二个实例打印出来的原因。因此按你这种方式继承的话,必须在构造函数外赋予新的prototype对象。LZ可以看看 《javascript高级程序设计》第4章,里面对js的继承做了详细的介绍。希望能对lz有所帮助

时间: 2024-10-22 15:21:41

关于JS原型继承的问题的相关文章

js原型继承的两种方法对比介绍

这篇文章主要介绍了js原型继承的两种方法对比介绍,需要的朋友可以参考下 在实际的项目中,我们通常都是用构造函数来创建一个对象,再将一些常用的方法添加到其原型对象上.最后要么直接实例化该对象,要么将它作为父类,再申明一个对象,继承该父类.   而在继承的时候有两种常用方式,今天我们就来稍作探讨    代码如下: //父类  function Person(name){     this.name = name; };    // 子类  function Student(sex){   Perso

浅析JS原型继承与类的继承_基础知识

我们先看JS类的继承 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JS类的继承</title> </head> <body> /* -- 类式继承 -- */ <script type="text/javascript"> //先声明一个超类 var Animal = function

JS原型继承和类式继承

类式继承(构造函数) JS中其实是没有类的概念的,所谓的类也是模拟出来的.特别是当我们是用new 关键字的时候,就使得"类"的概念就越像其他语言中的类了.类式继承是在函数对象内调用父类的构造函数,使得自身获得父类的方法和属性.call和apply方法为类式继承提供了支持.通过改变this的作用环境,使得子类本身具有父类的各种属性.   var father = function() { this.age = 52; this.say = function() { alert('hell

关于js原型继承理解详解

基本形式 我们先来看下面一段代码:  代码如下 复制代码 //构造器函数 function Shape(){ this.x = 0; this.y = 0; } //一个shape实例 var s = new Shape(); 虽然这个例子非常简单,但是有四个"非常重要"的点需要在此阐明: 1.s是一个对象,并且默认的它拥有访问Shape.prototype(即每个由Shape构造函数创建的对象拥有的原型)的权限:简单来说,Shape.prototype就是一个"监视&quo

JS原型继承

JS的面向对象写法 function worker(name, age){ this.name = name; this.age = age; this.isWorking = false; } worker.prototype.startWork = function(){ if(this.isWorking) return; this.isWorking = true; }; //在此处尝试定义一个endWork方法 var tom = new worker("tom", 40);

js原型继承的两种方法对比介绍_基础知识

在实际的项目中,我们通常都是用构造函数来创建一个对象,再将一些常用的方法添加到其原型对象上.最后要么直接实例化该对象,要么将它作为父类,再申明一个对象,继承该父类. 而在继承的时候有两种常用方式,今天我们就来稍作探讨 复制代码 代码如下: //父类 function Person(name){    this.name = name;};  // 子类 function Student(sex){  Person.apply(this,arguments); //继承父类的构造函数  this.

浅谈js原型链与继承

js原型链与继承是js中的重点,所以我们通过以下三个例子来进行详细的讲解.       首先定义一个对象obj,该对象的原型为obj._proto_,我们可以用ES5中的getPrototypeOf这一方法来查询obj的原型,我们通 过判断obj的原型是否与Object.prototype相等来证明是否存在obj的原型,答案返回true,所以存在.然后我们定义一个函数 foo(),任何一个函数都有它的prototype对象,即函数的原型,我们可以在函数的原型上添加任意属性,之后通过new一个实例

javascript原型继承工作原理和实例详解_javascript技巧

先为大家分享JS原型继承实例,供大家参考,具体内容如下 一.JS原型继承 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JS原型继承</title> </head> <body> <!--原型继承--> <script type="text/javascript"> //cl

js原型链与继承解析(初体验)_javascript技巧

首先定义一个对象obj,该对象的原型为obj._proto_,我们可以用ES5中的getPrototypeOf这一方法来查询obj的原型,我们通过判断obj的原型是否与Object.prototype相等来证明是否存在obj的原型,答案返回true,所以存在.然后我们定义一个函数foo(),任何一个函数都有它的prototype对象,即函数的原型,我们可以在函数的原型上添加任意属性,之后通过new一个实例化的对象可以共享其属性(下面的两个例子会详细介绍). function foo(){} fo