📄 day4_5.html
字号:
<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312-80"><style type="text/css"><!--a:link { color: blue; text-decoration: none}a:visited { color: purple; text-decoration: none}a:hover { color: #CC0033; text-decoration: underline}--></style><title>JavaScript高级教程</title><script language="JavaScript"><!--function doPreload(){ var the_images = new Array('stuff3a/kwmatt.jpg','stuff3a/matbon.jpg','stuff3a/lunchMat.jpg'); preloadImages(the_images);}function preloadImages(the_images_array) { for(loop = 0; loop < the_images_array.length; loop++) { var an_image = new Image(); an_image.src = the_images_array[loop]; }}// --></script></head><body topmargin="1" leftmargin="2"><table border="0" width="591" cellspacing="0"> <tr> <td bgcolor="#ffff99" width="451">JavaScript高级教程 - 第四课</td> </tr> <tr> <td bgcolor="#FF6600" width="451"><a href="mailto:thau@wired.com">Thau</a></td> </tr></table><div align="left"> <table border="0" width="630" cellspacing="0"> <tr> <td width="458" valign="top" align="left" rowspan="2"><small><small><br> </small></small><strong>第五页:对象的优点</strong> <p><font face="verdana, arial, geneva, sans-serif"></font>我们已经看过许多有关<font face="verdana, arial, geneva, sans-serif">JavaScript</font>现成的对象和它们的用法的<br> 例子:如<font face="verdana, arial, geneva, sans-serif">Window, Image, Document, Form</font>和其他一些<br> 对象。记住:一个对象只不过是一种特殊类型的数据,由属性<br> 和方法组成。属性是对象本身的一些东西,而方法则是能够加<br> 之于对象上的一些操作。 </p> <p> <font face="verdana, arial, geneva, sans-serif"></font>比如,<font face="verdana, arial, geneva, sans-serif">Window</font>对象有自己的属性,像<font face="verdana, arial, geneva, sans-serif"><tt>window.status</tt>, </font>它可<br> 以被读取与设置。通过把一个字符串设置成<font face="verdana, arial, geneva, sans-serif">Window</font>对象的<br> <font face="verdana, arial, geneva, sans-serif">status</font>属性,这个字符串将会显示在窗口的状态条里。<font face="verdana, arial, geneva, sans-serif">Window</font><br> 也有自己的方法,如<font face="verdana, arial, geneva, sans-serif"><tt>window.focus()</tt>, </font>即把窗口聚焦弹到前面。<br> 如果你对这些都不熟悉的话,你也许该去看看<a href="../course/day5_1.html">基础教程第五天</a><br> 的课程。</p> <p> <font face="verdana, arial, geneva, sans-serif"></font>使用对象给我们组织信息提供了一个很好的手段。首先我们看<br> 看现实生活中的对象。比如说,一只猴子就是一个对象。它有<br> 高度,宽度,毛发等等属性。所有的猴子都有相同的这些属性<br> 类型,是属性的值的不同才使一只猴子与其它猴子区别开来。<br> 猴子也有自己的方法,如玩儿<font face="verdana, arial, geneva, sans-serif"><tt>play()</tt></font>,吃<font face="verdana, arial, geneva, sans-serif"><tt>eat()</tt></font>,睡<font face="verdana, arial, geneva, sans-serif"><tt>sleep()</tt></font>等。</p> <p> <font face="verdana, arial, geneva, sans-serif"></font>对象很好理解还因为它能够保持有关词的“感觉”。例如<br> <font face="verdana, arial, geneva, sans-serif">JavaScript</font>中的聚焦方法<font face="verdana, arial, geneva, sans-serif"><tt>focus()</tt></font>,很显然就是使什么东西成为<br> 焦点。当聚焦方法作用到窗口对象时,它使该窗口弹到前面。<br> 而模糊则做相反的事儿。你可以试试:</p> <p> <font face="verdana, arial, geneva, sans-serif"></font><a href="#" onClick="little_window = window.open('http://www.hotwired.com/webmonkey/98/29/stuff3a/little.html','little','width=100,height=100'); return false;">打开一个小窗口</a></p> <p> <font face="verdana, arial, geneva, sans-serif"></font>按下面的链接来看看小窗口如何弹到前面:<br> <a href="#" onClick="little_window.focus(); return false;"><font face="verdana, arial, geneva, sans-serif">little_window.focus()</font>小窗口聚焦<font face="verdana, arial, geneva, sans-serif">;</font></a><font face="verdana, arial, geneva, sans-serif"><br> </font></p> <p> <font face="verdana, arial, geneva, sans-serif"></font>但当你把聚焦方法作用到一个文本框时,它使该文本框出现一<br> 个等待你输入的光标。</p> <form name="the_form"> <p> <font face="verdana, arial, geneva, sans-serif"></font> <input type="text" name="the_first_text" size="20"> <input type="text" name="the_second_text" size="20"> </p> </form> <p> <font face="verdana, arial, geneva, sans-serif"></font>激活第一个文本框<font face="verdana, arial, geneva, sans-serif">:<br> <a onMouseOver="window.document.the_form.the_first_text.focus();" href="#">window.document.the_form.the_first_text.focus();</a><br> </font>激活第二个文本框<font face="verdana, arial, geneva, sans-serif">:<a onMouseOver="window.document.the_form.the_second_text.focus();" href="#"><br> window.document.the_form.the_second_text.focus();</a> </font></p> <p> <font face="verdana, arial, geneva, sans-serif"></font>奇怪吗<font face="verdana, arial, geneva, sans-serif">? JavaScript</font>知道对窗口的聚焦和对文本框的聚焦做的<br> 不是一件事。在这两种情况里,聚焦的意思是一样的,所以很<br> 自然都用了聚焦这个名字。但同样的聚焦方法对不同的对象会<br> 做略微不同的事,这也很好理解。这种同一个方法因对象不同<br> 而做不同的事情称为“多态性”,这也是面向对象程序设计的<br> 基础。</p> <p> <font face="verdana, arial, geneva, sans-serif"></font>就象同样的方法因对象不同而表现不同一样,对于不同的对象,<br> 同样的属性也可以意味着不同的意思。比如 <font face="verdana, arial, geneva, sans-serif"><tt>length</tt></font>属性,在字<br> 符串和数组两类对象中都有这个属性。<font face="verdana, arial, geneva, sans-serif"><tt>string.length</tt></font>返回的是<br> 字符串的长度,<tt>而<font face="verdana, arial, geneva, sans-serif">array.length</font></tt>返回的则是数组的元素个数。<br> 两个的属性都叫 <font face="verdana, arial, geneva, sans-serif" size="2">length</font><font size="3">,但它们的意义随对象的不同而略有差<br> 别。</font></p> <font size="3"> <p> <font face="verdana, arial, geneva, sans-serif"></font>使用对象也使得代码的拷贝与粘贴更容易了。如果你有一个很<br> 好的对象库,你可以直接把整个对象拷贝下来用在你自己的<font face="verdana, arial, geneva, sans-serif">script</font><br> 中任何需要的地方,如果你没有一个组织得很清晰的对象库要<br> 作到这一点就难多了。</p> </font> <p><font size="3"> <font face="verdana, arial, geneva, sans-serif"></font>既然对象这么好用,<font face="verdana, arial, geneva, sans-serif">JavaScript</font>给你提供了创建自己对象的<br> 能力。<a href="day4_6.html">>></a></font></p> <p align="left"><font face="宋体" size="3" color="#000000"><strong>JavaScript高级教程</strong></font><font color="#FF0000" face="宋体" size="3"><br> </font><font size="3"><font color="#FF3300">第一页</font> <a href="day4_1.html"><font face="verdana, arial, geneva, sans-serif">JavaScript</font>高级教程<font face="verdana, arial, geneva, sans-serif">- </font>第<font face="verdana, arial, geneva, sans-serif">4</font>天</a> <br> <font color="#FF3300">第二页 </font><a href="day4_2.html">图象映射与<font face="verdana, arial, geneva, sans-serif">JavaScript</font></a><font face="verdana, arial, geneva, sans-serif"><br> </font><font color="#FF3300">第三页 </font><a href="day4_3.html">预装图象 - 是什么<font face="verdana, arial, geneva, sans-serif">?</font></a><font face="verdana, arial, geneva, sans-serif"><br> </font><font color="#FF3300">第四页 </font><a href="day4_4.html">预装图象 - 怎么做?</a><font face="verdana, arial, geneva, sans-serif"><br> </font><font color="#FF3300">第五页 </font>对象的优点<br> <font color="#FF3300">第六页 </font><a href="day4_6.html">创建你自己的对象</a><br> <font color="#FF3300">第七页 </font><a href="day4_7.html">你的面向对象的虚拟宠物</a><br> <font color="#FF3300">第八页 </font><a href="day4_8.html">计算字符串</a><br> <font color="#FF3300">第九页 </font><a href="day4_9.html">获取难以索引的对象</a><br> <font color="#FF3300">第十页 </font><a href="day4_10.html">另一种获取难以索引的对象的手段</a><br> <font color="#FF3300">第十一页 </font><a href="day4_11.html">第四天课程复习</a></font></p> <p>[<a href="day1_1.html">第1课</a>][<a href="day2_1.html">第2课</a>][<a href="day3_1.html">第3课</a>][第4课][<a href="day5_1.html">第5课</a>]</p> <hr align="left"> <!--webbot bot="Include" U-Include="../../copyright.html" TAG="BODY" startspan --> <p><font face="verdana, arial, geneva, sans-serif" size="2"><a href="http://phtshop.yeah.net" target="_top">本文根据 网猴 相关文章改编,版权归原作者所有。</a> </font><font color="#000000"><span class="smallfont"></span></font></p> <!--webbot bot="Include" endspan i-checksum="15926" --> </td> </tr> <tr> </tr> </table></div></body></html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -