JavaScript進階教程(第四課第一部分)
來源：互聯網
上載者：User
在以前的課程中，我們學習了對文本和字串的各種操作，今天我們專註於兩種不同的資料類型：圖象和對象。學完這一課，你將知道如何：
使用JavaScript來加速圖象交換。
建立你自己的對象來使指令碼易於理解。
使用關聯陣列來快速存取指令碼中的每一個對象。
使用JavaScript做圖象變換的一個主要問題是，它直到需要換圖時才去告訴瀏覽器下載那張圖象。如果你有一張大的圖象，想在滑鼠滑過一副圖象時調出來，瀏覽器得臨時下載這張圖，這可能會花一定時間從而使滑動效果大打折扣。
如果你的連線速度較慢，而你要調入的是一個相當大的圖象的話，那你把滑鼠放到圖上後只好去等待。由於有的瀏覽器要求被調入的圖象必須儲存在緩衝區裡，所以有時你可能根本就看不到圖象變換的效果。為了避免這些煩心的問題，我們可以把要變換的圖象在頁面調入時就預先裝載。
在Web編程時，預裝載是在需要圖片之前就將圖片下載到緩衝的技術。採用這樣的方式可以使當確實需要顯示圖片時迅速將其從緩衝中恢複回來並立即顯示。
預裝載圖象其實並不困難。你要做的就是建立一個新的image對象，然後把要預裝的圖象名設定成image的src屬性，如下所示：
var an_image = new Image();
an_image.src = "my_nice_image.gif";
通過設定image的src屬性就可以自動地把圖象下載到你的硬碟裡（當然假設你的cache可以用），然後圖象變換時就從硬碟直接讀入圖象而不用再去下載了。
剩下要做的唯一一件事就是，怎樣在頁面被下載以後和圖象變換操作之前使預裝圖象發生。讓人愉快的是這很簡單。HTML中的body標記有一個事件處理器叫onLoad，當頁面被調入後它將被調用。如果你的body標記是這樣的：
<body onLoad="doPreload();">
那麼doPreload()函數將在網頁下載後被調用。函數的代碼是這樣的：
function doPreload()
{
var the_images = new Array(kwmatt.jpg,matbon.jpg,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];
}
}
doPreload()函數建立了需要預裝的圖象名的數組，並把數組作為參數傳送到preloadImages()函數, preloadImages()函數包含了一個迴圈，每次迴圈都建立一個新的圖象對象，並把圖象名設到它的src屬性中。
不很難吧？圖象對象相當有用對吧？我很高興你這樣想，休息一會兒，馬上我們就要進入一個更令人興奮，更讓人動腦筋的話題：建立你自己的對象。
