|
|
數(shù)組是一種列表。各種列表比如名單、URL以顏色列表都可以存儲在數(shù)組中。
這里我們生成顏色的數(shù)組：
var colors = new Array("red","blue","green");
現(xiàn)在你就有了一個數(shù)組，你能對它做什么呢？數(shù)組的優(yōu)點在于數(shù)組中的各個元素可以通過數(shù)字調(diào)用。第一個元素的數(shù)字是0，可以用以下方式調(diào)用：
var the_element = colors[0];
執(zhí)行這一行JavaScript指令時，變量the_element所被賦予的值是字符串"red" 。通過寫出數(shù)組的名稱并將數(shù)組中元素的順序號放在方括號內(nèi)就可調(diào)用數(shù)組中的該元素。數(shù)組中第2個元素的順序號是1。
一旦生成數(shù)組后，你可以添加和修改數(shù)組值。如果你打算將顏色數(shù)組的第1個元素有紅色該為紫色，你可以這樣做：
colors[0] = "purple";
數(shù)組經(jīng)常用于循環(huán)。下面將講數(shù)組和循環(huán)的應(yīng)用。
數(shù)組是一項非常有用的東西，因為你可以循環(huán)調(diào)用數(shù)組中的各個元素執(zhí)行某項功能。以下是循環(huán)顯示一個URL數(shù)組中的各個元素的例子。
首先，要使該例子發(fā)揮作用，我們需要聲明一些變量：
var url_names = new Array("hits.org","awaken.org","bianca.com");
var a_url;
接下來，我們循環(huán)調(diào)用數(shù)組中的各個元素，打開每個URL并對待用戶點擊alert框的OK按鈕：
for(loop=0; loop<url_names.length;loop++)
{
// make the name of a url, for example http://www.hits.org/
a_url = "http://www." + url_names[loop] + "/";
// open a window
var new_window=open(a_url,"new_window","width=300,height=300");
// wait for the click
alert("hit ok for the next site");
}
首先，你會注意到循環(huán)從0一直到url_names.length這個變量。將.length放在數(shù)組名的后面由于告訴你數(shù)組中有多少個元素。但是，注意數(shù)組元素的數(shù)目同數(shù)組最后一個元素的索引號（順序號）不同。如果數(shù)組中有3個元素，則數(shù)組的長度為3，但是數(shù)組中最后一個元素的索引號卻是array[2].。這是因為數(shù)組中第1個元素的索引號是array[0].。如果你執(zhí)行數(shù)組調(diào)用時得到諸如"object not found" 的錯誤信息，而你的代碼中有一個數(shù)組，則有可能是因為你將數(shù)組元素的索引號同數(shù)組中元素的數(shù)目混淆了。
不也許還會注意到將.length放在數(shù)組的結(jié)尾處很有點想給一個對象附加一些屬性。這是因為數(shù)組本身就是對象，而length就是數(shù)組的一項屬性。
數(shù)組術(shù)語對象的另一個表現(xiàn)是：你需要用新指令才能生成新的數(shù)組。在上例中，url_names = new Array(......) 實際可以解釋為：生成一個新數(shù)組，用url_names對其做一個引用。你可以注意到單詞"new" 以這種方式被應(yīng)用時，就生成了一個新的對象。
循環(huán)中的第1行生成一個變量。其賦值為一個字符串。
a_url = "http://www." + url_names[loop] + "/";
循環(huán)開始時，變量循環(huán)的初始值為0。url_names數(shù)組的第1個元素是字符串"hits.org".，所以在第一次循環(huán)中，變量a_url等值于字符串"http://www.hits.org/".。
循環(huán)的下一行用該URL打開一個窗口
var new_window=open(a_url,"new_window","width=300,height=300");
由于每次打開窗口時我們給窗口起的名稱都一樣，所以在轉(zhuǎn)到新的URL時，不會打開許多窗口。如果我們在上例中去掉窗口名稱"new_window"，則每次循環(huán)時就會打開一個新窗口。
循環(huán)的第3行只是打開一個alert框，并對待用戶點擊OK 按鈕。
數(shù)組還可以由于其它元素，而不只是字符串。數(shù)組可以應(yīng)用于JavaScript文檔對象模型（Document Object Model）的各個方面。下一講將要講述這方面的知識。
下面是onClick=""鏈接中的代碼：
var change=prompt('Change which image (0 or 1)?','');
window.document.images[change].src='three.jpg';
本例打算用圖片交換來演示數(shù)組如何介入DOM的。試一下本例，看一下源碼。
document.image_name.src = 'some_image.gif';
為了做這事，每個圖片都需命名到。若你不知要交換的圖片名，但卻知道其在HTML頁中的順序?？梢杂盟腄OM數(shù)來指定該圖片。
一個HTML文件中的第一個圖片是document.images[0]，第二個是document.images[1]，如此類推。若你想知道一個文件中有多少個圖片，你可檢查圖片數(shù)組長度知道：document.images.length。例如，你想改變你的網(wǎng)頁中所有圖形為一個Spacer GLF圖片，你可以這樣做：
for(loop=0; loop<document.images.length; loop++)
{
document.images[loop].src = 'spacer.gif';
}
清楚了吧？
好。下一講我們準(zhǔn)備學(xué)習(xí)函數(shù)。
函數(shù)是編程需學(xué)的最后一個基本組成。所有的程序語言都是函數(shù)。函數(shù)是一些角次可調(diào)用的、無須重寫的東西。
如果你想教會自己快速閱讀并且用一個一旦點擊可告訴你當(dāng)前時間的長文本鏈接。
例如…時間!
看源碼：
<a href="#" onClick="
var the_date = new Date();
var the_hour = the_date.getHours();
var the_minute = the_date.getMinutes();
var the_second = the_date.getSeconds();
var the_time = the_hour + ':' + the_minute + ':' + the_second;
alert('The time is now: ' + the_time);">時間!</a>
在這里這段JavaScript的工作細(xì)節(jié)并不重要；一會我們再回來復(fù)習(xí)一下。
重要的是它太長了。若這些時間鏈接再有10個，你須每次剪貼這段程序。這使你的HTML既長且難看。另外，若你想改變這段程序，就必須在10個不同地方改變。
你可以寫一個函數(shù)來執(zhí)行而不用作10次拷貝程序。這里的函數(shù)使用變的即容易編輯又容易閱讀。
請看如何寫一段計時函數(shù)。
該HTML頁含有一個叫做announceTime的函數(shù)。從一個鏈接調(diào)用annoumnceTime：
<a href="#" onClick="announceTime();">時間!</a>
就象這樣：
下行看起來就象第二課：
<a href="#" onClick="alert('Hello!');">Hello!</a>
這稱為從一個鏈接調(diào)用警告對話框。函數(shù)就象一種方法，唯一不同的是，方法依附于一個對象。在這個警告的例子中，這個對象是一個窗口對象。
讓我們回到函數(shù)本身。如果你看看源碼，你將看到函數(shù)位于HTML文件的頭部中。
<html>
<head>
<title>無參數(shù)函數(shù)</title>
<script langauge="JavaScript">
<!-- hide me
function announceTime()
{
//get the date, the hour, minutes, and seconds
var the_date = new Date();
var the_hour = the_date.getHours();
var the_minute = the_date.getMinutes();
var the_second = the_date.getSeconds();
//put together the string and alert with it
var the_time = the_hour + ":" + the_minute + ":" + the_second;
alert("The time is now: " + the_time);
}
// show me -->
</script>
</head>
<body>
...
</body>
</html>
好，讓我們逐行復(fù)習(xí)這個函數(shù)。首先，所有函數(shù)來自于該種格式：
function functionName(parameter list)
{
statements ...
}
函數(shù)的命名規(guī)則于變量差不多。第一個字符必須是字母或一標(biāo)準(zhǔn)符號。其余字符可為數(shù)字或一橫線。但必須保證函數(shù)不于已定義的變量同名。否則將出現(xiàn)很糟糕的結(jié)果。我是用內(nèi)部大寫的方式命名函數(shù)以保證它們不與字符碰巧重名。
函數(shù)名后是一組參數(shù)。本例是無參數(shù)的函數(shù)，下一例中我們再舉例描述。
參數(shù)后是函數(shù)的主體。這是一組當(dāng)函數(shù)調(diào)用后是想運行的語句。在下面幾個例子中，我打算利用這個報時器，所以讓我描述一下它是怎樣工作的。
第一行：
var the_date = new Date();
取得一個新的日期對象。就象你在用數(shù)組時取得一個新的數(shù)組一樣，在你要找出即時是什么時間時你需要先取得一個日期對象。當(dāng)找到了一個新的日期對象，它自動重置到當(dāng)前的日期和時間。為了在對象以外得到這個信息，你必須使用這種對象方法：
這些方法從日期對象上取得了合適的數(shù)字。
var the_hour = the_date.getHours();
var the_minute = the_date.getMinutes();
var the_second = the_date.getSeconds();
你可能疑惑：我怎樣能假定日期對象知道何種方式？甚或我如何知道有這樣一件事可作為日期對象？這些緣由應(yīng)從Javascript庫中獲取，我將盡我所能解釋內(nèi)置Javascript對象，但不一定能徹底的使你清楚。
函數(shù)的其他部分就很清楚了。它以這種方式調(diào)用返回數(shù)字，把它們變成字符串，并且調(diào)用警告方式以彈出一個字符串對話框。注意你可以在函數(shù)內(nèi)部調(diào)用一個方式和函數(shù)。我們將詳盡討論。
現(xiàn)在如果你也玩透了時間鏈接，你可能注意到了有些什么不對的事。你每次可能會得到這樣的反饋：“12:12:04”，這是getSecond()將返回值為“4”。那么當(dāng)你合成為時間時，你看到的就是the_minute+“:”+the_second得到14:4而非是我們想要的。解決它是個容易的事，需要個新的函數(shù)來修補(bǔ)分、秒合成值。
請看參數(shù)及返回值。
盡管無參數(shù)的函數(shù)在減少寫源碼工作量，HTML源碼可讀性上很有用，但有參數(shù)的函數(shù)會更為有用。
上一例中，當(dāng)返回的分、秒值小于10時會有問題發(fā)生。我們想要看到的秒值是04而非4。我們可以這樣做：
var the_minute = the_date.getMinutes();
if (the_minute < 10)
{
the_minute = "0" + the_minute;
}
var the_second = the_date.getSeconds();
if (the_second < 10)
{
the_second = "0" + the_second;
}
它會非常有效。但是注意，同樣的源碼你寫了兩次：若某件東西小于10，則前面加“0”。所以要考慮當(dāng)用同一代碼要多次重寫時，用函數(shù)來做。本例中我寫了一個叫fixNumber的函數(shù)：
function fixNumber(the_number)
{
if (the_number < 10)
{
the_number = "0" + the_number;
}
return the_number;
}
fixNumber的參數(shù)是the_number。一個參數(shù)也是一個變量，當(dāng)該函數(shù)被調(diào)用時，其參數(shù)值也被設(shè)置。在本例中，我們這樣調(diào)用函數(shù)：
var fixed_variable = fixNumber(4);
參數(shù)the_number在函數(shù)中設(shè)置為4。到現(xiàn)在你應(yīng)該對fixNumber的主體有了一定的了解。它的意思是：如果變量the_number小于10，則在它的前面加一個0。這里面新的內(nèi)容是return指令：返回the_number的值。在下面的情況中就會用到return指令：
var some_variable = someFunction();
變量some_variable的值是函數(shù)someFunction() 的返回值。在fixNumber中，我加入: return the_number，則退出函數(shù)并將返回the_number的值返回給任何一個等待被設(shè)置的變量。
所以，我這樣書寫代碼：
var fixed_variable = fixNumber(4);
the_number的初始值將通過函數(shù)調(diào)用被設(shè)置為4，然后由于4小于10，所以the_number將被改為"04"。然后the_number值被返回，而且變量fixed_variable將被設(shè)置為"04" 。
為了將fixNumber包括在原始函數(shù)announceTime()中，我添加了如下內(nèi)容：
function announceTime()
{
//get the date, the hour, minutes, and seconds
var the_date = new Date();
var the_hour = the_date.getHours();
var the_minute = the_date.getMinutes();
var fixed_minute = fixNumber(the_minute);
var the_second = the_date.getSeconds();
var fixed_second = fixNumber(the_second);
//put together the string and alert with it
var the_time = the_hour + ":" + fixed_minute + ":" + fixed_second;
alert("The time is now: " +the_time);
}
假定時間鏈接被點擊時，時間為12:04:05。用new Date()獲得日期，用getHours()獲得小時，用前面所屬方法獲得分鐘，分鐘在本例中應(yīng)該是4, 然后調(diào)用fixNumber，其參數(shù)為the_minute:
var fixed_minute = fixNumber(the_minute);
當(dāng)fixNumber()被調(diào)用時，參數(shù)the_number被設(shè)置為the_minute。在本例中由于the_minute是4，所以the_number將被設(shè)置為4。
設(shè)置完參數(shù)后，我們進(jìn)入函數(shù)主體。由于4小于10，the_number被改變?yōu)?04"，然后the_number值用return指令返回。當(dāng)"04"被fixNumber返回后，本例fixed_minute就等于"04"。
我們一步一步來研究該過程。假定時間為12:04:05。
我們從函數(shù)announceTime()開始
1.the_minute = the_date.getMinutes();則the_minute = 4
2.fixed_minute = fixNumber(the_minute);等于函數(shù)fixNumber()并將其值返回給fixed_minute
現(xiàn)在進(jìn)入函數(shù)fixNumber()
3.函數(shù)fixNumber(the_number)fixNumber()用the_minute的值調(diào)用，the_minute值是4，所以現(xiàn)在the_number = 4
4.如果(the_number < 10) {the_number = "0" + the_number;}由于4小于10，所以the_number現(xiàn)在等于"04"
5.返回the_number值，退出該函數(shù)并返回值"04"
現(xiàn)在已經(jīng)退出函數(shù)fixTime()，所以現(xiàn)在我們回到announceTime()
6.該函數(shù)返回值為"04"，所以fixed_minute 現(xiàn)在等于"04"
該例用了一個只有一個參數(shù)的函數(shù)。實際上你可以為函數(shù)設(shè)置多個參數(shù)。下一講我們將要講多于一個參數(shù)的函數(shù)。
JavaScript技術(shù)：JavaScript初級教程(第四課)第1/2頁，轉(zhuǎn)載需保留來源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請第一時間聯(lián)系我們修改或刪除，多謝。
