JS 建立对象的方法_Javascript教程-查字典教程网
JS 建立对象的方法
JS 建立对象的方法
发布时间:2016-12-30 来源:查字典编辑
摘要:Objectsareusefultoorganizeinformation.对于组织信息来讲对象是非常有用的JavaScriptObject...

Objectsareusefultoorganizeinformation.

对于组织信息来讲对象是非常有用的

JavaScriptObjects

JS对象

EarlierinthistutorialwehaveseenthatJavaScripthasseveralbuilt-inobjects,likeString,Date,Array,andmore.Inadditiontothesebuilt-inobjects,youcanalsocreateyourown.

在教程的前面部分我们已经看过JS有一些内置的对象,像String,Date,Array和更多一些。除此之外我们可以建立属于自己的对象。

Anobjectisjustaspecialkindofdata,withacollectionofpropertiesandmethods.

对象是特殊的数据,有着相关的一系列属性和方法。

Let'sillustratewithanexample:Apersonisanobject.Propertiesarethevaluesassociatedwiththeobject.Thepersons'propertiesincludename,height,weight,age,skintone,eyecolor,etc.Allpersonshavetheseproperties,butthevaluesofthosepropertieswilldifferfrompersontoperson.Objectsalsohavemethods.Methodsaretheactionsthatcanbeperformedonobjects.Thepersons'methodscouldbeeat(),sleep(),work(),play(),etc.

让我们说明一个例子:一个人为一个对象。属性就是与对象关联的值。人的属性包含名字,身高,体重,年龄,肤色,眼睛的颜色等等。所有人都有这些属性,但是值却可能人与人都不同。对象还有方法。方法就是对象的动作行为。人的方法就可以是eat()[吃],sleep()[睡觉],work()[工作]等等。

Properties属性

Thesyntaxforaccessingapropertyofanobjectis:

关联一个对象的属性语法为:

objName.propName

Youcanaddpropertiestoanobjectbysimplygivingitavalue.AssumethatthepersonObjalreadyexists-youcangiveitpropertiesnamedfirstname,lastname,age,andeyecolorasfollows:

你可以通过赋值来给对象添加属性。假设personObj已经存在-你可以给对象添加姓和名以及下面的年纪和眼睛颜色:

personObj.firstname="John"

personObj.lastname="Doe"

personObj.age=30

personObj.eyecolor="blue"document.write(personObj.firstname)

Thecodeabovewillgeneratethefollowingoutput:

上面的代码就会输出:

John

Methods方法

Anobjectcanalsocontainmethods.

一个对象还可以包括方法

Youcancallamethodwiththefollowingsyntax:

你可以用下面的语法来调用一个方法:

objName.methodName()

Note:Parametersrequiredforthemethodcanbepassedbetweentheparentheses.

方法所需要的参数写在括号之间

Tocallamethodcalledsleep()forthepersonObj:

为personObj对象调用一个sleep()方法

personObj.sleep()

--------------------------------------------------------------------------------

CreatingYourOwnObjects

建立你自己的对象

Therearedifferentwaystocreateanewobject:

建立新的对象有两种不同的方法

1.Createadirectinstanceofanobject

直接建立

Thefollowingcodecreatesaninstanceofanobjectandaddsfourpropertiestoit:

下面的代码可以直接建立一个对象并给它加上四个属性:

personObj=newObject()

personObj.firstname="John"

personObj.lastname="Doe"

personObj.age=50

personObj.eyecolor="blue"

AddingamethodtothepersonObjisalsosimple.Thefollowingcodeaddsamethodcalledeat()tothepersonObj:

给对象建立一个方法也十分的简单。下面的代码就加了一个eat()方法

personObj.eat=eat

2.Createatemplateofanobject

建立一个对象模块

Thetemplatedefinesthestructureofanobject:

模块定义对象的构架

functionperson(firstname,lastname,age,eyecolor)

{

this.firstname=firstname

this.lastname=lastname

this.age=age

this.eyecolor=eyecolor

}

Noticethatthetemplateisjustafunction.Insidethefunctionyouneedtoassignthingstothis.propertyName.Thereasonforallthe"this"stuffinisthatyou'regoingtohavemorethanonepersonatatime(whichpersonyou'redealingwithmustbeclear).That'swhat"this"is:theinstanceoftheobjectathand.

注意模块只是一个函数,函数里面你需要给this.propertyName分配东西。所有都是"this"的原因是你接下来会一下子有不止一个person(是哪个person你必须清楚)。

Onceyouhavethetemplate,youcancreatenewinstancesoftheobject,likethis:

一旦你有了模块,你就可以这样直接建立新的对象了:

myFather=newperson("John","Doe",50,"blue")

myMother=newperson("Sally","Rally",48,"green")

Youcanalsoaddsomemethodstothepersonobject.Thisisalsodoneinsidethetemplate:

你也可以加一些方法给person对象,这也可以在模块里完成:

functionperson(firstname,lastname,age,eyecolor)

{

this.firstname=firstname

this.lastname=lastname

this.age=age

this.eyecolor=eyecolorthis.newlastname=newlastname

}

Notethatmethodsarejustfunctionsattachedtoobjects.Thenwewillhavetowritethenewlastname()function:

注意,这个方法只是对象的附加函数,接下来我们将必须写入newlastname()函数

functionnewlastname(new_lastname)

{

this.lastname=new_lastname

}

Thenewlastname()functiondefinestheperson'snewlastnameandassignsthattotheperson.JavaScriptknowswhichpersonyou'retalkingaboutbyusing"this.".So,nowyoucanwrite:myMother.newlastname("Doe").

newlastname()函数定义了person的新lastname并分配给了person。使用"this"的话JS会明白你在描述哪个person。所以现在你可以写:myMother.newlastname("Doe")

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类