js对象的构造和继承实现代码

JavaScript019

js对象的构造和继承实现代码,第1张

复制代码

代码如下:

<script>

//定义js的user对象

function

User(name,age){

this.name=name,

this.age=age,

this.getName=function(){

return

this.name

},

this.getAge=function(){

return

this.age

}

}

//实例化一个对象

var

use=new

User("aa",21)

alert(use.name)

alert(use.getAge())

//js对象继承

/*

jb51.net

在面向对象的编程方法中,对象继承是必不可少的,那么怎么在javascript中实现继承机制呢。由于javascript并不是一个严格的面向对象的语言,因此在对象继承上也显的不一样。我们也来创建一个基类Polygon,代表一个多边形,一个多边形有个共同的属性就是边数(sides)和一个共同的方法计算面积(getAreas)。这样我们的这具Polygon类看起来就像下面这样定义:

*/

function

Polygon(iSides){

this.sides

=

iSides

}

Polygon.prototype.getAreas

=

function(){

return

0

}

/*

因为基类并不能确定面积,因此在这里我们返回为0。

接着我们就创建一个子类Triangle,一个三角形,显然这个三角形是要从多边形继承的,因此我们要让这个Triangle类继承Polygon类,并且要覆盖Polygon类的getAreas方法来返回三角形的面积。我们来看下在javascript中的实现:

*/

function

Triangle(iBase,

iHeight){

Polygon.call(this,3)

//在这里我们用Polygon.call()来调用Polygon的构造函数,并将3作为参数,表示这是一个三角形,因为边是确定的,所以在子类的构造函数中就不需要指定边了

this.base

=

iBase

//三角形的底

this.height

=

iHeight

//三角形的高

}

Triangle.prototype

=

new

Polygon()

Triangle.prototype.getAreas

=

function(){

return

0.5

*

this.base

*this.height

//覆盖基类的getAreas方法,返回三角形的面积

}

/*

参考上面的实现,我们再定义一个矩形:

*/

function

Rectangle(iWidth,

iHeight){

Polygon.call(this,4)

this.width

=

iWidth

this.height

=

iHeight

}

Rectangle.prototype

=

new

Polygon()

Rectangle.prototype.getAreas

=

function(){

return

this.width

*

this.height

}

/*

好了,上面我们定义了一个基类和两个子数,下面我们来测试一个这两个子类是否能正常工作:

*/

var

t

=

new

Triangle(3,6)

var

r

=

new

Rectangle(4,5)

alert(t.getAreas())

//输出9说明正确

alert(r.getAreas())

//输出20说明正确

</script>

var person1=createPerson("Nicholas",29,"software Engineer")

var person1=new Person("Nicholas",29,"software Engineer")

区别在这两句话中,你可以看到第一个语句里面没有new关键字,直接执行一个函数;而第二个表达式中有new,也就是说是新实例化了一个对象。

JS中关于this的定义是:函数直接在全局中执行,那么this指向的是全局对象window。也就是说你在createPerson中new了一个o,但是你再执行this.name=name那么就等于是执行了window.name=name,o对象本身不会有任何印象,最后你return了o也只是得到了一个空对象。

而JS中执行了new之后,等于通过构造函数创建了一个新对象,那么这个构造函数中的this也就指向了这个新实例化的对象,此时this.name=name修改了新对象person1中的name值。

关于对象实例化的知识和this指向的问题题主还多翻一翻博客园的文章,讲的很详细,从长久发展来看先打好基础对你以后的道路更有好处。

<scripttype="text/javascript">functionfun(){alert("good")varage=1this.name='MrS.G'this.method=fun2}functionfun2(){alert("thisisthesecondmethodshow")}functionfun1(){varobj=newfun()alert(obj.name)obj.method()alert(obj.age)}window.onload=fun1</script>在fun1()方法中通过varobj=newfun()创建了一个对象。fun()是一个特殊的函数 构造函数,它和普通的函数有什么区别和联系我将在下边谈论。注意到上边有两种形式定义变量。this.name和varage.其实通过this方式创建的变量叫做对象的成员变量,可以在外部通过对象引用。而varage是一个局部变量(如果放到外层,是一个全局变量)这个变量不能被对象在外部引用(如obj.age)否则是undefine,可以将它看成是一个对象的私有成员变量。接下来看看看构造函数的执行过程。首先执行varobj=newfun()这一步后,记录现场,然后跳到fun()的构造函数中,执行alert("good")跳出对话框。接下来就是创建成员变量了(如java中在堆中创建内存空间,创建栈)。好了fun()执行完了,回到fun1(),执行下去。注意一点,alert(obj.age)是undefine.我现在想知道哪些函数可以new(),哪些不可以new().<scripttype="text/javascript">functionfun2(){alert("thisisthesecondmethodshow")}functionfun1(){varobj=newfun2()alert(obj)alert('ifdisplaytherenoerrothroughthecall')}window.onload=fun1</script>这里functionfun2()是一个函数,但是它是构造函数吗?你可以将它当做一个构造函数。这里会发现fun1()中的alert()可以正常执行。这里可以总结为任何函数都可以new,在js中函数就是对象。但是试想一下这里new有意义吗?fun2()中没有变量,或者都是var定义的变量,那么在外部引用不了。new它干嘛呢?,还不如让fun2()作为全局函数执行好了。这里可以回答本章的要探索的问题了:任何函数都是构造函数,如果通过new就可以得到一个对象。通过函数不同的上下文调用分下面几种:(1).当在一个函数调用之前有new关键字,则上下文为新建的对象;//任何函数可以new创建一个对象(2).当一个函数使用call或者apply调用时,给定的第一个参数即为上下文;//构造方法中可以写成员方法。然后通过对象来调用(3).否则,如果一个函数作为一个对象的属性(obj.func)或者obj['func'])来调用时,它就把该对象作为上下文来运行;//上边newfun2()没意义,直接fun2()调用,这里在全局上下文运行(4)如果与上述几条都不符的话,则函数将在全局上下文中运行。