您查询的关键词是:基于对象的js语言 
下面是原始网址 http://www.docin.com/p-94540524.html 在 2017-04-24 00:10:05 的快照。

360搜索与该网页作者无关,不对其内容负责。

基于对象的js语言 - 豆丁网

基于对象的js语言

基于对象的js语言 基于对象的js 语言2010-06-06 17:45JavaScript 语言是基于对象的 (Object-Based),而不是面向对象的(object-oriented)。之所以说它是一门基 于对象的语言,主要是因为它没有提供象抽象、继承、重载等有关面向对象语 言的许多功能。而是把其它语言所创建的复杂对象统一起来,从而形成一个非 常强大的对象系统。虽然JavaScript 语言是一门基于对象的,但它还是具有一 些面向对象的基本特征。它可以根据需要创建自己的对象,从而进一步扩大 JavaScript 的应用范围,增强编写功能强大的Web 文档。一、对象的基础知识 1、对象的基本结构JavaScript 中的对象是由属性(properties)和方法 (methods)两个基本的元素构成的。前者是对象在实施其所需要行为的过程中, 实现信息的装载单位,从而与变量相关联;后者是指对象能够按照设计者的意 图而被执行,从而与特定的函数相联。 2、引用对象的途径一个对象要真正地被使用,可采用以下几种方式获得: 1)引用JavaScript 内部对象;2)由浏览器环境中提供;3)创建新对象。这就是 说一个对象在被引用之前,这个对象必须存在,否则引用将毫无意义,而出现 错误信息。从上面中我们可以看出JavaScript 引用对象可通过三种方式获取。 要么创建新的对象,要么利用现存的对象。 3、有关对象操作语句JavaScript 不是一纯面向对象的语言,它设有提供 面向对象语言的许多功能,因此JavaScript 设计者之所以把它称"基于对象"而 不是面向对象的语言,在JavaScript 中提供了几个用于操作对象的语句和关键 字及运算符。1)for.in 语句格式如下:for(对象属性名in 已知对象名)说明: 该语句的功能是用于对已知对象的所有属性进行操作的控制循环。它是将一个 已知对象的所有属性反复置给一个变量;而不是使用计数器来实现的。该语句 的优点就是无需知道对象中属性的个数即可进行操作。 例:下列函数是显示数组中的内容:functionshowData(object){for(var 30;x++)document.write(object[x]);}注:此处object 是数组.该函数是通过数组下标顺序值,来访问每个对象 的属性,使用这种方式首先必须知道数组的下标值,否则若超出范围,就会发 生错误。而使用for.in 语句,则根本不需要知道对象属性的个数,见下: function showData(object){for(var prop object)document.write(object[prop]);}注:此处object 是对象.使用该函数时,在循环体中,For 自动将属性取 出来,直到最后为此。 语句使用该语句的意思是:在该语句体内,任何对变量的引用被认为是这个对象的属性,以节省一些代码.with object{.}所有在with 语句后的 花括号中的语句,都是在后面object 对象的作用域的。 关键字this是对当前的引用,在JavaScript 中,由于对象的引用 是多层次,多方位的,往往一个对象的引用又需要对另一个对象的引用,而另 一个对象有可能又要引用另一个对象,这样有可能造成混乱,最后自己已不知 道现在引用的是那一个对象,为此JavaScript 提供了一个用于将对象指定为当 前对象的语句this。 4)new 运算符虽然在JavaScript 中对象的功能已经是非常强大的了。但更 强大的是设计人员可以按照需求来创建自己的对象,以满足某一特定的要求。 使用New 运算符可以创建一个新的对象。其创建对象,使用如下格式: Newobject=new Object(Parameters table);其中Newobject 是创建的新 对象:object 是已经存在的对象;parameters table 参数表;new JavaScript中的命令语句。如创建一个日期新对象newData=new Date()birthday=new Date(December 12.1998)之后就可使用NewData、 birthday 作为一个新的日期对象了。 4、对象属性的引用对象属性的引用可由下列三种方式之一实现:(1)使用 点(.)运算符university.Name="云南省"university.city="昆明市 "university.Date="1999"其中university 是一个已经存在的对象,Name、 City、Date 是它的三个属性,并通过操作对其赋值。 (2)通过对象的下标实现引用university[0]="云南"university[1]="昆明 市"university[2]="1999"a)通过数组形式访问属性,可以使用循环操作获取其 functionshowunievsity(object){for(var j++)document.write(object[j])}b)若采用for.in则可以不知其属性的个数就 可以实现:function showmy(object){for(var prop this)document.write(this[prop]);}(3)通过字符串的形式实现university["Name"]="云南 "university["City"]="昆明市"university["Date"]="1999"5、对象方法的引 用在JavaScript 中对象方法的引用是非常简单的。ObjectName.methods()实际 上methods()=FunctionName,方法实质上是一个函数。如引用university 对象 中的showmy()方法,则可使用:document.write(university.showmy())或: document.write(university) 如引用math 内部对象中cos()的方法则: with(math){document.write(cos(35));document.write(cos(80));}若不使 则引用时相对要复杂些:document.write(Math.cos(35))document.write(Math.sin(80)) 二、常用对象的属性和方法JavaScript 为我们提供了一些非常有用的常用 内部对象和方法。用户不需要用脚本来实现这些功能。这正是基于对象编程的 真正目的。在JavaScript 提供了string(字符串)、math(数值计算)和Date(日 期)三种对象和其它一些相关的方法。从而为编程人员快速开发强大的脚本程序 提供了非常有利的条件。 1、常用内部对象在JavaScript 中对于对象属性与方法的引用,有两种情 况:其一是说该对象是静态对象,即在引用该对象的属性或方法时不需要为它 创建实例;而另一种对象则在引用它的对象或方法时是必须为它创建一个实例, 即该对象是动态对象。对JavaScript 内部对象的引用,是以紧紧围绕着它的属 性与方法进行的。因而明确对象的静动性对于掌握和理解JavaScript 内部对象 是具有非常重要的意义。1)串对象String 对象:内部静态性。访问 properties 和methods 时,可使用(.)运算符实现。基本使用格式: objectName.prop/methods(1)串对象的属性该对象只有一个属性,即length。 它表明了字符串中的字符个数,包括所有符号。例:mytest="This aJavaScript"mystringlength=mytest.length最后mystringlength 返回 mytest 字串的长度为20。 (2)串对象的方法string 对象的方法共有19 个。主要用于有关字符串在 Web 页面中的显示、字体大小、字体颜色、字符的搜索以及字符的大小写转换。 其主要方法如下:a)锚点anchor():该方法创建如用Html 文档中的anchor 记一样。使用anchor如用Html Name=""一样。通过下列格式访问:string.anchor(anchorName)。b)有关字符显示的控制方法big()字体显 示,Italics()斜体字显示,bold()粗体字显示,blink()字符闪烁显示,small() 字符用小体字显示,fixed()固定高亮字显示、fontsize(size)控制字体大小等。 字体颜色方法;fontcolor(color)c)字符串大小写转换toLowerCase()-小 写转换,toUpperCase()大写转换。下列把一个给定的串分别转换成大写和小写 格式:string=stringValue.toUpperCase string=stringValue.toLowerCase。d)字符搜索:indexOf[charactor,fromIndex]从指定formIndex 位置开始 搜索charactor 第一次出现的位置。 e)返回字串的一部分字串:substring(start,end)从start 开始到end 字符全部返回。2)算术函数的 Math 对象功能:提供除加、减、乘、除以外的一些自述运算。 如对数,平方根等。静动性:静态对象(1)主要属性math 中提供了6 个属性, 它们是数学中经常用到的常数E、以10 为底的自然对数LN10、以2 为底的自然 对数LN2、3.14159 的PI、1/2 的平方根SQRT1-2,2 的平方根为SQRT2。 (2)主要方法绝对值:abs()正弦余弦值:sin(),cos()反正弦反余弦: asin(),acos()正切反正切:tan(),atan()四舍五入:round()平方根:sqrt() 基于几方次的值:Pow(base,exponent). 3)日期及时间对象功能:提供一个有关日期和时间的对象。静动性:动态 性,即必须使用New 运算符创建一个实例。例:MyDate=New Date()Date 对象 没有提供直接访问的属性。只具有获取和设置日期和时间的方法。日期起始值: 1770 日00:00:00。(1)获取日期的时间方法getYear():返回年数getMonth():返回当月号数 getDate():返回当日号数getDay():返回星期几getHours():返回小时数 getMintes(:返回分钟数getSeconds():返回秒数getTime():返回毫秒数 (2)设置日期和时间:setYear();设置年setDate():设置当月号数 setMonth():设置当月份数setHours():设置小时数setMintes():设置分钟 数setSeconds():设置秒数setTime():设置毫秒数. 2、JavaScript 中的系统函数JavaScript 中的系统函数又称内部方法。它 提供了与任何对象无关的系统函数,使用这些函数不需创建任何实例,可直接用。 1.返回字符串表达式中的值:方法名:eval(字串表达式),例: test=eval("8+9+5/2"); 2.返回字符串ASCI 码:方法名:unEscape(string) 3.返回字符的编码:方法名:escape(character) 4.返回实数:parseFloat(floatstring); 5、返回不同进制的数:parseInt(numbestring,radix)其中radix 进制,numbestring字符串数字 三、范例下面是一个时钟显示的JavaScript 文档。在文档中用了非常多的 函数。html head style TYPE="text/css"!----/style title 时钟/title script language="JavaScript"var timerID=null;var timerRunning=false; function stopClock(){if(timerRunning)clearTimeout(timerID); timerRunning=false;document.clock.face.value="";} function showTime(){var now=new Date();var year=now.getYear(); var month=now.getMonth()+1;var date=now.getDate();var hours=now.getHours();var mins=now.getMinutes();var secs=now.getSeconds();var timeVal="";timeVal+=((hours=12)?hours: hours-12);timeVal+=((mins 10)?":0"":")+mins;timeVal+=((secs=10)?": 0":":")+secs;timeVal+=((hours 12)?"AM":"PM");timeVal+=((month 10)?"on 0":"on")+month+"-";timeVal+=date+"-"+year; document.clock.face.value=timeVal; timerID=setTimeout("showTime()",1000);timerRunning=true} function startClock(){stopClock();showTime();} /script/head body onLoad="startClock()"p align="center"big span style="background-color:pink"font face="Arial"form/font font face=" 宋体"时钟/font/span/big/p palign="center"/p div align="center"center table border="0"cellspacing="0"cellpadding="0"tr td width="100%"form name="clock"div align="center"center pinput type="text"name="face"size="20"style="background-color: rgb(192,192,192)"/p/center/div/form/td/tr/table/center/div/body/html