建站
咨詢
售后
建站咨詢
新聞中心
第一頁：Javascript高級教程- 第5天
哇！- 今天是最后一天！真是好極了！作為對您這些天辛勤工作的獎(jiǎng)勵(lì)，我把今天的課程安排得非常放松 -
沒有本質(zhì)代碼縈繞在你腦中，也沒有多如牛毛的家庭作業(yè)，只是編碼理論和指向資源的連接。
10多年的梅縣網(wǎng)站建設(shè)經(jīng)驗(yàn)，針對設(shè)計(jì)、前端、開發(fā)、售后、文案、推廣等六對一服務(wù)，響應(yīng)快，48小時(shí)及時(shí)工作處理。成都全網(wǎng)營銷推廣的優(yōu)勢是能夠根據(jù)用戶設(shè)備顯示端的尺寸不同，自動(dòng)調(diào)整梅縣建站的顯示方式，使網(wǎng)站能夠適用不同顯示終端，在瀏覽器中調(diào)整網(wǎng)站的寬度，無論在任何一種瀏覽器上瀏覽網(wǎng)站，都能展現(xiàn)優(yōu)雅布局與設(shè)計(jì)，從而大程度地提升瀏覽體驗(yàn)。創(chuàng)新互聯(lián)公司從事“梅縣網(wǎng)站設(shè)計(jì)”,“梅縣網(wǎng)站推廣”以來，每個(gè)客戶項(xiàng)目都認(rèn)真落實(shí)執(zhí)行。
今天討論以下話題：
幫你寫Javascript的工具
調(diào)試技術(shù)
使你的Javascript代碼快速運(yùn)行的技巧
可得到的工具
說實(shí)話，就算稱我為老學(xué)究，我也只用字處理器來寫Javascript。 雖然有大量的可用來寫Javascript的工具，但是它們產(chǎn)生的代碼非常笨拙而且很難更改。如果你真想使用一種工具來創(chuàng)建Javascript代碼，我向你推薦Dreamweaver，它能在很短時(shí)間內(nèi)產(chǎn)生一些令人驚異的Javascript代碼。但是，如果你打算隨后更改這些代碼，就要做好面對一些非常難看的代碼的準(zhǔn)備。
你也能找到幫你調(diào)試Javascript的工具。我也不用這些工具。網(wǎng)景有一個(gè)，微軟也有一個(gè)，但我從未見過很成功地使用這些調(diào)試器的人。你可以試一試，或許可以證明我是錯(cuò)的。但是在有人能使我確信某種產(chǎn)品值得買（暗示：送我一套那種免費(fèi)軟件）之前，我寧愿用老方法調(diào)試我的代碼。
調(diào)試技術(shù)
隨著用Javascript編程的深入，你會(huì)開始理解那些Javascript給出的不透明錯(cuò)誤信息。一旦你理解了你常犯的一般性錯(cuò)誤，你就會(huì)很快知道怎樣避免它們，這樣你寫的代碼中的錯(cuò)誤將越來越少。編程實(shí)際上是一種能隨著時(shí)間不斷飛快進(jìn)步的技術(shù)。但是不管變得多么熟練，你仍然要花一些時(shí)間調(diào)試你的代碼。
如果你做過家庭作業(yè)，或有過Jacascript編程經(jīng)驗(yàn)，你會(huì)知道相當(dāng)多的時(shí)間是花在調(diào)試上。這很正常 - 這只是編程者必須做的事之一。實(shí)際上，按照大量的研究，程序員平均百分之五十的時(shí)間花在解決代碼中的錯(cuò)誤。
關(guān)鍵是學(xué)會(huì)怎樣有效地調(diào)試你的程序。我有一些技巧可以幫助你解決程序?yàn)槭裁礇]有象應(yīng)該的那樣運(yùn)行，或者幫你首先避免寫有很多錯(cuò)誤的代碼：
用不同方式打印出變量
注意一般性錯(cuò)誤
編碼之前先想好
讓我們以打印出那些變量開始。
第二頁：打印變量
一旦你發(fā)現(xiàn)一個(gè)錯(cuò)誤，就可以清除它。不幸的是，發(fā)現(xiàn)它們的出處并不總是很容易 - 你的大部分調(diào)試時(shí)間只是花在指出錯(cuò)誤的位置。
最可靠的方法之一是在你的代碼中加入一些簡單的語句打印出正在發(fā)生什么。假如你在下面的兩段程序中發(fā)現(xiàn)一個(gè)問題：
function getName()
{
var first_name = prompt("what‘s your first
name?","");
var last_name = prompt("what‘s your last name?","");
var the_name = first_name + " " + last_name;
}
function theGreeting()
{
var the_name = "";
the_name =
getName();
if (the_name == "Dave Thau")
{
alert("Hello, oh greatest
one!");
} else {
alert("Ahoy palloi!");
}
}
運(yùn)行這段程序，看看你是否能發(fā)現(xiàn)出了什么問題（Netscape 3.x的用戶可能會(huì)遇到一些錯(cuò)誤檢查的問題，這是由于Netscape
3.x本身的原因，以下的Javascript例子與此相同）。如果你在警告對話框中隨意輸入一些名字，你會(huì)得到問候：“Ahoy
palloi!”。但是，如果你在第一個(gè)提示對話框中輸入“Dave”，在第二個(gè)中輸入“Thau”，你應(yīng)該得到“Hello,oh greatest
one!”這條信息。然而，你還是只得到“Ahoy
palloi!”這條信息。很明顯，
函數(shù)中出了錯(cuò)誤。在這個(gè)簡單的例子程序中，你或許只是查看Javascript代碼就能發(fā)現(xiàn)錯(cuò)誤。然而，當(dāng)你的代碼變得越來越復(fù)雜時(shí)，只靠目測來發(fā)現(xiàn)錯(cuò)誤會(huì)變得愈加困難。
如果Javascript沒能捕獲你的錯(cuò)誤，你也沒有通過查看代碼發(fā)現(xiàn)錯(cuò)誤，有時(shí)打印出變量會(huì)對你有所幫助。最簡單的方法是象下面這樣使用一個(gè)alert()：
// theGreeting gets a name using getName, then presents
// one or two
alert boxes depending on what the name is
//function getName()
{
var first_name = prompt("what‘s your first name?","");
var last_name =
prompt("what‘s your last name?","");
var the_name = first_name + " " +
last_name;
alert("in getName, the_name is: " + the_name);
}
// theGreeting gets a name using getName, then presents
// one of two
alert boxes depending on what the name is
// function
theGreeting()
{
var the_name = "";
the_name = getName();
alert("after getName, the_name = " + the_name);
if (the_name == "Dave
Thau")
{
alert("hello, oh greatest one!");
}else{
alert("ahoy palloi!");
}
}
請注意我們已經(jīng)在所有重要的地方加入警告語句?，F(xiàn)在試著運(yùn)行這段程序。如果你輸入名稱“Dave”和“Thau”，你會(huì)注意到第一個(gè)警告顯示“in
getName, the_name is: Dave Thau,”，但是第二個(gè)警告顯示“after getName, the_name =
undefined,”，這就告訴你在getName()的最后一行事情變得糟糕起來。不知何故，the_name只在函數(shù)存在前正確，但是theGreeting沒有給變量the_name正確賦值。當(dāng)你寫的函數(shù)能正確運(yùn)行，但返回值出現(xiàn)
問題時(shí)，你最先要做的就是檢查你是否的確讓其返回了一個(gè)值。很明顯，問題就出在這兒。getName()函數(shù)指出了名稱，但沒有返回它。所以我們應(yīng)把語句“return
the_name;”加到函數(shù)末尾。
把一些警告對話框加入你的代碼中是很有幫助的。不幸的是，每隔一行就按一次“OK”也是一種痛苦。
不用警告對話框也能調(diào)試代碼。一種選擇是把調(diào)試信息寫到窗體的一個(gè)文本區(qū)內(nèi)。另一種可能是把調(diào)試信息寫在另一個(gè)窗口上。這兒有一個(gè)把調(diào)試信息寫在下面文本區(qū)的調(diào)試代碼的例子。
使你的調(diào)試經(jīng)歷更舒適的第三個(gè)訣竅是這樣的：創(chuàng)建不同的調(diào)試等級，然后設(shè)置“調(diào)試”變量。下面就是在此頁上運(yùn)行的Javascript代碼：
// debug can be either none, alert, or textarea
// depending on the kind
of debugging I want to do
// var debug = "none";
// function getName gets
a first and last name,
// concatenates them with a space in between,
//
and returns the name function getName()
{
var first_name =
prompt("what‘s your first name?","");
var last_name = prompt("what‘s your
last name?","");
var the_name = first_name + " " + last_name;
var
error_message = "in getName, the_name is: " + the_name;
doError("in
getName, the_name is: " + the_name);
}
// theGreeting gets a name using getName, then presents
// one of two
alert boxes depending on what the name is
// function
theGreeting()
{
var the_name = "";
the_name = getName();
doError("after getName, the_name = " + the_name);
if (the_name == "Dave
Thau")
{
alert("hello, oh greatest one!");
} else {
alert("ahoy palloi!");
}
}
// doError is the error handling routine
// depending on the type of debug
message
// it presents either no debug message, an alert
// or puts the
message in a textarea
//
function doError(the_message)
{
if
(debug == "alert")
{
alert(the_message);
} else if (debug
== "textarea")
{
window.document.the_form.the_text.value +=
the_message + "
";
}
}
請注意我已經(jīng)定義了一個(gè)叫“debug”的變量，它可以是“none”，“alert”或“textarea”。于是當(dāng)我想產(chǎn)生一個(gè)錯(cuò)誤信息時(shí)，我把它送給函數(shù)doError()，此函數(shù)可能什么也不做，或者顯示一個(gè)消息對話框，或者把消息粘貼到一個(gè)文本區(qū)中，這取決于我怎樣設(shè)置調(diào)試變量。當(dāng)你想同時(shí)看到多條錯(cuò)誤信息時(shí)，你可以設(shè)置調(diào)試變量為“textarea”。當(dāng)你準(zhǔn)備把你的代碼顯示給全世界時(shí)，你只需要把調(diào)試變量設(shè)為“none”，于是錯(cuò)誤信息將不再出現(xiàn)，這樣可以省去發(fā)現(xiàn)和清除所有調(diào)試語句的麻煩。
通常，程序員可以創(chuàng)建不同的調(diào)試等級，如“none”，“brief”和“extreme”?！癰rief”將打印一些調(diào)試信息，“extreme”將打印大量調(diào)試信息，“none”當(dāng)然不會(huì)打印任何信息。
如果你按此方法建立你的調(diào)試系統(tǒng)，你可以在編碼時(shí)把調(diào)試等級設(shè)為“brief”，在準(zhǔn)備公布你的Javascript時(shí)把調(diào)試變量設(shè)為“none”。如果有不可思議的事情發(fā)生，并且你不知道去哪兒發(fā)現(xiàn)問題，你可以把調(diào)試等級設(shè)為“extreme”，然后流覽所有的調(diào)試信息直到發(fā)現(xiàn)可疑的地方。
好了，調(diào)試系統(tǒng)就討論到這兒?，F(xiàn)在讓我們看看Javascript編碼
器產(chǎn)生的一般性錯(cuò)誤。
第三頁：一般性程序錯(cuò)誤
多數(shù)錯(cuò)誤只是無聊的語法錯(cuò)誤。記住關(guān)閉那些引號，大括號和
小括號會(huì)花費(fèi)很長時(shí)間，不過幸運(yùn)的是Javascript自動(dòng)錯(cuò)誤檢
測器能捕獲大部分此類錯(cuò)誤。雖然Javascript錯(cuò)誤檢測器隨著
日漸復(fù)雜的流覽器而不斷完善，但是一些錯(cuò)誤仍會(huì)溜走。下面
是一些需要留意的常見錯(cuò)誤：
混淆變量名或函數(shù)名
大寫和復(fù)數(shù)變量和函數(shù)名產(chǎn)生的錯(cuò)誤令人煩惱地經(jīng)
常出現(xiàn)，有時(shí)Javascript錯(cuò)誤檢測器不能捕獲它們。
通過建立和堅(jiān)持使用一種對變量和函數(shù)的命名協(xié)定，
會(huì)大大減少這些麻煩的數(shù)量。例如，我全部用小寫
字母定義變量，并用下劃線代替空格
（my_variable,
the_data, an_example_variable），用內(nèi)置符號表
示函數(shù)
(addThreeNumbers(), writeError()等)。
我避免使用任何復(fù)數(shù)，因?yàn)槲铱偸峭浤切┳兞渴?br />不是復(fù)數(shù)。
偶然地使用了保留字
一些字不能作為變量名，因?yàn)樗鼈円呀?jīng)被Javascript
使用。例如，不能定義一個(gè)叫“if”的變量，因?yàn)?br />它實(shí)際上是Javascript的一部分
-
如果使用“if”，
你會(huì)遇到各種麻煩。當(dāng)你因?yàn)槭褂妹麨椤癷f”的
變量而變得瘋狂時(shí)，一個(gè)叫做“document”的變量
是很誘人的。不幸的是，“document”是一個(gè)
Javascript對象。另一個(gè)經(jīng)常遇到的問題是把變量
命名為“name”（窗體元素有“names”屬性）。把
變量命名為“name”不會(huì)總出問題，只是有時(shí)
-
這會(huì)更使人迷惑 - 這就是避免使用“name”變量的
原因。
不幸的是，不同的流覽器有不同的保留字，所以沒
有辦法知道該回避哪些字。最安全的辦法是避免使
用已經(jīng)成為Javascript一部分的字和HTML使用的字。
如果你因?yàn)樽兞坑龅絾栴}，并且不能發(fā)現(xiàn)哪兒錯(cuò)了，
試著把變量改個(gè)名字。如果成功了，你或許就避開
了保留字。
記住在邏輯判斷時(shí)應(yīng)該用兩個(gè)等號
一些流覽器能捕獲這種錯(cuò)誤，有些卻不能。這是一
種非常常見的錯(cuò)誤，但是如果流覽器不能替你指
出來，你就很難發(fā)現(xiàn)。下面是一個(gè)這種錯(cuò)誤的例子：
var the_name = prompt("what‘s your name?", "");
if (the_name = "the
monkey")
{
alert("hello monkey!");
} else {
alert("hello
stranger.");
}
這段代碼將產(chǎn)生“hello monkey!”警告對話框 -
不管你在提示里敲的是什么 -
這不是我們希望的。
原因是在if-then語句中只有一個(gè)等號，這句話告
訴Javascript你想讓一件事等于另一件。假設(shè)你在
提示中敲的是“robbie
the robot”。最開始，變
量the_name的值是“robbie the
robot”，但是隨
后if語句告訴Javascript你想把the_name設(shè)為
“the
monkey.”。于是Javascript很高興地執(zhí)行你
的命令，送一個(gè)“true”消息給if-then語句，結(jié)果
警告對話框每次都出現(xiàn)“hello
monkey!”。
這種陰險(xiǎn)的錯(cuò)誤會(huì)使你發(fā)瘋，所以注意使用兩個(gè)
等號。
偶然給變量加上了引號，或忘了給字符串加引號
我不時(shí)遇到這個(gè)問題。Javascript區(qū)分變量和字符
串的唯一方法是：字符串有引號，變量沒有。下面
有一個(gè)明顯的錯(cuò)誤：
var the_name = ‘koko the gorilla‘;
alert("the_name is very
happy");
雖然the_name是一個(gè)變量，但是程序還會(huì)產(chǎn)生一個(gè)
提示“the_name is very
happy,”的警告對話框。
這是因?yàn)橐坏㎎avascript看見引號包圍著某些東西
就不再考慮它，所以當(dāng)你把the_name放在引號里，
你就阻止了Javascript從內(nèi)存中查找它。
下面是一個(gè)不太明顯的此類錯(cuò)誤的擴(kuò)展（我們已經(jīng)
在第三天的課程里見過）：
function wakeMeIn3()
{
var the_message = "Wake up! Hey! Hey!
WAKE UP!!!!";
setTimeout("alert(the_message);",
3000);
}
這里的問題是你告訴Javascript三秒后執(zhí)行alert
(the_message)。但是，三秒后the_message將不再
存在，因?yàn)槟阋呀?jīng)退出了函數(shù)。這個(gè)問題可以這樣
解決：
function wakeMeIn3()
{
var the_message = "Wake up!";
setTimeout("alert(‘" + the_message+ "‘);",
3000);
}
把the_message放在引號外面，命令“alert(‘Wake
up!‘);”由setTimeout預(yù)定好，就可以得到你想
要的。
這只是一些可能在你的代碼中作祟的很難調(diào)試的
錯(cuò)誤。一旦發(fā)現(xiàn)了它們，就有不同的或好或差的方
法來改正錯(cuò)誤。你很幸運(yùn)，因?yàn)槟隳軓奈业慕?jīng)驗(yàn)和
錯(cuò)誤中獲益。
第四頁：修正錯(cuò)誤
找到錯(cuò)誤，有時(shí)侯雖然很難，卻只是第一步。然后你必須清除
錯(cuò)誤。下面是一些在清除錯(cuò)誤時(shí)應(yīng)該做的一些事：
首先拷貝你的程序
有些錯(cuò)誤很難清除。實(shí)際上，有時(shí)在根除錯(cuò)誤時(shí)，
你會(huì)破壞整個(gè)程序 -
一個(gè)小錯(cuò)誤使你瘋狂。在開始
調(diào)試前保存你的程序是確保錯(cuò)誤不會(huì)利用你的最好
方法。
一次修正一個(gè)錯(cuò)誤
如果你知道有好幾個(gè)錯(cuò)誤，應(yīng)該修正一個(gè)，檢驗(yàn)其
結(jié)果，再開始下一個(gè)。一次修正許多錯(cuò)誤而不檢驗(yàn)
你的工作只會(huì)招致更多的錯(cuò)誤。
警惕迷惑性錯(cuò)誤
有時(shí)你知道存在一個(gè)錯(cuò)誤，但不真正知道為什么。
假設(shè)有一個(gè)變量“index”，由于某種原因“index”
總比你期望的小1。你可以做下面兩件事中的一件：
在那兒坐一會(huì)兒，解決它為什么變小了，或只是聳
聳肩；在使用“index”之前加1,然后繼續(xù)進(jìn)行。后
一種方法稱為迷惑編程。當(dāng)你開始思考“究竟是怎
么了
- 為什么index是2而不是3呢？好吧...我現(xiàn)在
先讓它正常工作，以后再修改錯(cuò)誤?！睍r(shí)，你正在
把一塊護(hù)創(chuàng)膏布貼到一處潛在的硬傷上。
迷惑編程可能在短期內(nèi)有用，但是你可以看到長期
的厄運(yùn) -
如果你沒有完全理解你的代碼到可以真正
清除錯(cuò)誤的程度，那個(gè)錯(cuò)誤將會(huì)回來困擾你。它或
者以另一種你不能解決的怪異錯(cuò)誤的方式回來，或
者當(dāng)下一個(gè)可憐的被詛咒的靈魂讀你的代碼時(shí)，他
會(huì)發(fā)現(xiàn)你的代碼非常難以理解。
尋找小錯(cuò)誤
有時(shí)侯，對程序員來說，剪切和粘貼代碼的能力是
一種很壞的事。通常，你會(huì)在一個(gè)函數(shù)中寫一些
Javascript代碼，然后把它們剪切和粘貼到另一個(gè)
函數(shù)中。如果第一個(gè)函數(shù)有問題，那么現(xiàn)在兩個(gè)函
數(shù)都有問題。我并不是說你不應(yīng)該剪切和粘貼代碼。
但是錯(cuò)誤會(huì)以某種方式繁殖，如果你發(fā)現(xiàn)了一個(gè)
錯(cuò)誤，你就應(yīng)該尋找與其相似的其它錯(cuò)誤。（或者
在制作它的若干版本之前確切知道會(huì)發(fā)生什么。）
變量名拼寫錯(cuò)誤在一段Javascript代碼中會(huì)突然多
次出現(xiàn)
- 在一個(gè)地方把the_name錯(cuò)拼成teh_name，
你就有機(jī)會(huì)在其它地方發(fā)現(xiàn)這個(gè)錯(cuò)誤。
如果所有其它的方法都失敗了
如果你正坐在那兒盯著一個(gè)錯(cuò)誤，并且不能指出是
怎么回事（或者根本沒有發(fā)現(xiàn)錯(cuò)誤，但是因?yàn)槌绦?br />不能正確運(yùn)行，你知道存在錯(cuò)誤），你最好從計(jì)算
機(jī)前走開。去讀一本書，在角落散散步，或者拿一
杯可口的飲料
-
做些事，任何事，但不要去想程序
或問題。這種技術(shù)在某種情況下叫做“醞釀”，效
果非常好。在你稍做休息和放松后，再試著找出
錯(cuò)誤。你會(huì)得到一幅比較清晰的景象?！搬j釀”起
作用是因?yàn)樗鼓銖乃季S混亂中解脫出來。如果沿
著一條錯(cuò)路走太遠(yuǎn)，你有時(shí)會(huì)發(fā)現(xiàn)無法轉(zhuǎn)身。這種
情況下最好開辟一條新路。我知道這會(huì)令人發(fā)火，
但確實(shí)有效。真的！
如果上面的方法還不成功...
請求別人的幫助。有時(shí)你的思想會(huì)形成定式，只有
換一種眼光才能洞察問題之所在。在結(jié)構(gòu)化編程環(huán)
境中，程序員們定期地互相復(fù)查別人的代碼。這可
以適當(dāng)?shù)亟凶觥按a復(fù)查”，不僅可以幫助消除
錯(cuò)誤，還可以得到更好的代碼。不要怕把你的
Javascript代碼給別人看,它會(huì)使你成為更好的
Javascript程序員。
但是消除錯(cuò)誤的絕對最好的辦法是...
一開始就創(chuàng)建沒有錯(cuò)誤的代碼。>>
第五頁：好的編程實(shí)踐
編好程序的關(guān)鍵是程序是寫給人的，不是寫給計(jì)算機(jī)的。如
果你能明白其他人或許會(huì)閱讀你的Javascript，你就會(huì)寫更
清晰的代碼。代碼越清晰，你就越不容易犯錯(cuò)誤。機(jī)靈的代
碼是可愛的，但就是這種機(jī)靈的代碼會(huì)產(chǎn)生錯(cuò)誤。最好的經(jīng)
驗(yàn)法則是KISS，即Keep
It Simple,Sweetie（保持簡單，可愛）。
另一個(gè)有幫助的技術(shù)是在寫代碼之前作注釋。這迫使你在動(dòng)
手之前先想好。一旦寫好了注釋，你就可以在其下面寫代碼。
下面是一個(gè)用這種方法寫函數(shù)的例子：
第一步：寫注釋
//function beSassy()
// beSassy asks for a user‘s name, chooses a random
// insult and returns an alert box with the user‘s name and the
//
insult.
function beSassy()
{
// first write a list of
insults
//
// next get the user‘s name
//
// then choose a random insult
//
// finally, return the personalized sass
//
}
第二步：填充代碼
//function beSassy()
// beSassy asks for a user‘s name, chooses a random
// insult and returns an alert box with the user‘s name and the
//
insult.
function beSassy()
{
// first write a list of
insults
//
var the_insult_list = new Array;
the_insult_list[0] = "your
shoe lace is untied";
the_insult_list[1] = "your
mama!";
the_insult_list[2] = "it‘s hard to be insulting";
// next get the user‘s name
//
var the_name = prompt("What‘s your
name?", "");
// then choose a random insult
//
var the_number = Math.random() *
5;
var insult_number = parseInt(the_number);
var the_insult =
the_insult_list[insult_number];
// finally, return the personalized sass
//
alert("Hey " + the_name +
" " + the_insult);
}
這種先寫注釋的策略不僅迫使你在寫代碼前思考，而且
使編碼的過程看起來容易些 -
通過把任務(wù)分成小的，
易于編碼的各個(gè)部分，你的問題看起來就不太象珠穆朗
瑪峰，而象一群令人愉悅的起伏的小山。
最后...
總以分號結(jié)束你的每一條語句。
雖然并不是嚴(yán)格必需，你應(yīng)該養(yǎng)成以分號結(jié)束每一條語
句的習(xí)慣，這樣可以避免這行后面再有代碼。忘了加
分號，下一行好的代碼會(huì)突然產(chǎn)生錯(cuò)誤。
把變量初始化為“var”，除非你有更好的理由不這樣做。
用“var”把變量局域化可以減少一個(gè)函數(shù)與另一個(gè)不相
關(guān)函數(shù)相混淆的機(jī)會(huì)。
好了，既然你已經(jīng)知道了如何編碼，下面就讓我們學(xué)習(xí)怎樣使
你的Javascript快速運(yùn)行。
第六頁：按速度優(yōu)化Javascript代碼
一旦你的Javascript能運(yùn)行，你就會(huì)想到使其運(yùn)行得更快。
在講解加速代碼的方法之前，讓我先講講“80/20規(guī)則”：
百分之八十的優(yōu)化是由最初百分之二十的工作所完成的。竭
力實(shí)現(xiàn)剩余百分之二十的速度優(yōu)化是一種巨大的痛苦，而且
經(jīng)常導(dǎo)致完全不能讀和難以管理的代碼。簡言之，如果你的
Javascript運(yùn)行得很慢，你可以用很多簡單的方法來加速它，
但是除非你的代碼確實(shí)運(yùn)行得很慢，我不會(huì)對它進(jìn)行再優(yōu)化。
下面是一些使你的代碼輕松運(yùn)行的方法。
限制循環(huán)內(nèi)的工作量
程序運(yùn)行慢的最常見原因是循環(huán)內(nèi)的重復(fù)工作。如果一
條命令只需要執(zhí)行一次，就沒有必要把它放在循環(huán)內(nèi)。
例如：
var index = 0;
while (index <10)
{
var the_date = new
Date();
var the_day = the_date.getDay();
var the_name =
prompt("what‘s the kid‘s name? " ,"");
alert("On " + the_day + " " +
the_name + " is a very special person.");
index++;
}
此程序循環(huán)執(zhí)行10次。每次得到當(dāng)天的日期，詢問小孩
的名字，然后打印出“On Monday,so-and-so is a
very
special person.”。
但是日期是不會(huì)改變的，總是今天。所以沒有必要把前
兩行放在循環(huán)中。把它們從循環(huán)中拿出來，讓其只執(zhí)行
一次而不是10次，這樣會(huì)節(jié)省時(shí)間：
var
index = 0;
var the_date = new Date();
var the_day =
the_date.getDay();
while (index <10)
{
var the_name = prompt("what‘s
the kid‘s name? " ,"");
alert("On " + the_day + " " + the_name + " is a very
special person.");
index++;
}
定制if-then-else語句，按最可能到最不可能的順序
因?yàn)閕f-then-else語句在遇到條件為真時(shí)結(jié)束，你可以
通過把最有可能的條件放到最開始來減少需要判斷的語
句的數(shù)量。例如：
var pet = prompt("what kind of pet do you have?", "");
if (pet == "cat")
{
doCatStuff();
} else if (pet == "dog")
{
doDogStuff();
} else if (pet == "bird")
{
doBirdStuff();
} else
if (pet == "lizard")
{
doLizardStuff();
}
一般來說，程序中的if子句比從lizard到dog需要執(zhí)行的
邏輯判斷要少。
最小化重復(fù)執(zhí)行的表達(dá)式
如果你發(fā)現(xiàn)需要重復(fù)計(jì)算一個(gè)特定的表達(dá)式，如
var
pi=22/7，只計(jì)算一次并把它放在一個(gè)全局變量中或
許是個(gè)好主意。例如，不象下面程序這樣：
function theArea(radius)
{
var pi = 22/7;
var area = pi * radius *
radius;
return area;
}
function theCircumference(radius)
{
var pi = 22/7;
var circumference
= 2 * pi * radius;
return circumference;
}
而是這樣做：
var pi = 22/7;
function theArea(radius)
{
var area = pi * radius *
radius;
return area;
}
function theCircumference(radius)
{
var
circumference = 2 * pi * radius;
return circumference;
}
我知道我在用一個(gè)全局變量，我也說過這不是一個(gè)好主意。
然而，一些數(shù)字，如pi，其值在程序中永遠(yuǎn)不會(huì)改變，是
此規(guī)則的特例。通過只計(jì)算pi一次，可以省去額外的計(jì)算。
或許時(shí)間上的一些小的節(jié)省，累加起來會(huì)很管用。
如果你發(fā)現(xiàn)代碼運(yùn)行很慢，你只要注意一些事情。這些都
很明顯，但是當(dāng)你發(fā)現(xiàn)你經(jīng)常忽略象這樣簡單的優(yōu)化技巧
時(shí)，你會(huì)很吃驚。
還有，我的朋友，讓我們結(jié)束今天的課程，這也是整個(gè)
Javascript高級教程的結(jié)束。如果你已經(jīng)進(jìn)行到這兒，
并且你至少讀過過去五天課程中的一半，那么你已經(jīng)看
過很多Javascript代碼了。實(shí)際上，如果你能理解跨越
第一部分和第二部分的10課的大部分內(nèi)容，你就可以很
安全地把自己稱為“Javascript助手”。通往神秘真知
的路就在你的腳下。
第七頁：下面講什么？
既然你已經(jīng)對Javascript有了實(shí)際的理解，你就可以寫一些非
常認(rèn)真的Javascript程序了?，F(xiàn)在該是把目標(biāo)轉(zhuǎn)移到Javascript
應(yīng)用上的時(shí)候。Taylor的“動(dòng)態(tài)HTML教程”是一個(gè)很好的開始。
學(xué)會(huì)動(dòng)態(tài)HTML，你就可以實(shí)現(xiàn)更遠(yuǎn)大的夢想。不論如何，總該
有一些夢想吧。
但是首先，你需要練習(xí)，練習(xí)，再練習(xí)。把已有的代碼拿過來，
使它變得面目全非?；蛘甙资制鸺覍懘a。努力寫出無錯(cuò)誤的
代碼，成為一個(gè)能修正各種無論如何也要溜走的錯(cuò)誤的專家。
用眼睛盯著有趣的和新的Javascript應(yīng)用程序，指出它們是如
何實(shí)現(xiàn)的。你的代碼運(yùn)行得是否完美并不重要，因?yàn)樗偰芙?br />你些什么。你學(xué)得越多，你的代碼就會(huì)變得越好，越快，越容
易創(chuàng)建。
網(wǎng)頁標(biāo)題：JavaScript高級教程-第5天(轉(zhuǎn))
文章分享：http://www.dlmjj.cn/article/iijggg.html
