Javascript調(diào)試腳本的經(jīng)驗(yàn)之談
更新時(shí)間:2008年10月13日 18:31:46 作者:
隨著用JavaScript編程的深入,你會(huì)開(kāi)始理解那些JavaScript給出的不透明錯(cuò)誤信息。一旦你理解了你常犯的一般性錯(cuò)誤,你就會(huì)很快知道怎樣避免它們,這樣你寫(xiě)的代碼中的錯(cuò)誤將越來(lái)越少。
雖然the_name是一個(gè)變量,但是程序還會(huì)產(chǎn)生一個(gè)提示“the_name is very happy,”的警告對(duì)話框。這是因?yàn)橐坏㎎avaScript看見(jiàn)引號(hào)包圍著某些東西就不再考慮它,所以當(dāng)你把the_name放在引號(hào)里,你就阻止了 JavaScript從內(nèi)存中查找它。下面是一個(gè)不太明顯的此類(lèi)錯(cuò)誤的擴(kuò)展:
function wakeMeIn3()
{
var the_message = "Wake up! Hey! Hey! WAKE UP!!!!";
setTimeout("alert(the_message);", 3000);
}
這里的問(wèn)題是你告訴JavaScript三秒后執(zhí)行alert(the_message)。但是,三秒后the_message將不再存在,因?yàn)槟阋呀?jīng)退出了函數(shù)。這個(gè)問(wèn)題可以這樣解決:
function wakeMeIn3()
{
var the_message = "Wake up!";
setTimeout("alert('" + the_message+ "');", 3000);
}
把the_message放在引號(hào)外面,命令“alert('Wakeup!');”由 setTimeout預(yù)定好,就可以得到你想要的。這只是一些可能在你的代碼中作祟的很難調(diào)試的錯(cuò)誤。一旦發(fā)現(xiàn)了它們,就有不同的或好或差的方法來(lái)改正錯(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ò)誤使你瘋狂。在開(kāi)始調(diào)試前保存你的程序是確保錯(cuò)誤不會(huì)利用你的最好方法。
一次修正一個(gè)錯(cuò)誤
如果你知道有好幾個(gè)錯(cuò)誤,應(yīng)該修正一個(gè),檢驗(yàn)其結(jié)果,再開(kāi)始下一個(gè)。一次修正許多錯(cuò)誤而不檢驗(yàn)?zāi)愕墓ぷ髦粫?huì)招致更多的錯(cuò)誤。
警惕迷惑性錯(cuò)誤
有時(shí)你知道存在一個(gè)錯(cuò)誤,但不真正知道為什么。假設(shè)有一個(gè)變量“index”,由于某種原因 “index”總比你期望的小1。你可以做下面兩件事中的一件:在那兒坐一會(huì)兒,解決它為什么變小了,或只是聳聳肩;在使用“index”之前加1,然后繼續(xù)進(jìn)行。后一種方法稱(chēng)為迷惑編程。當(dāng)你開(kāi)始思考“究竟是怎么了 - 為什么index是2而不是3呢?好吧...我現(xiàn)在先讓它正常工作,以后再修改錯(cuò)誤?!睍r(shí),你正在把一塊護(hù)創(chuàng)膏布貼到一處潛在的硬傷上。
迷惑編程可能在短期內(nèi)有用,但是你可以看到長(zhǎng)期的厄運(yùn) - 如果你沒(méi)有完全理解你的代碼到可以真正清除錯(cuò)誤的程度,那個(gè)錯(cuò)誤將會(huì)回來(lái)困擾你。它或者以另一種你不能解決的怪異錯(cuò)誤的方式回來(lái),或者當(dāng)下一個(gè)可憐的被詛咒的靈魂讀你的代碼時(shí),他會(huì)發(fā)現(xiàn)你的代碼非常難以理解。
尋找小錯(cuò)誤
有時(shí)侯,對(duì)程序員來(lái)說(shuō),剪切和粘貼代碼的能力是一種很壞的事。通常,你會(huì)在一個(gè)函數(shù)中寫(xiě)一些 JavaScript代碼,然后把它們剪切和粘貼到另一個(gè)函數(shù)中。如果第一個(gè)函數(shù)有問(wèn)題,那么現(xiàn)在兩個(gè)函數(shù)都有問(wèn)題。我并不是說(shuō)你不應(yīng)該剪切和粘貼代碼。但是錯(cuò)誤會(huì)以某種方式繁殖,如果你發(fā)現(xiàn)了一個(gè)錯(cuò)誤,你就應(yīng)該尋找與其相似的其它錯(cuò)誤。(或者在制作它的若干版本之前確切知道會(huì)發(fā)生什么。)變量名拼寫(xiě)錯(cuò)誤在一段JavaScript代碼中會(huì)突然多次出現(xiàn) - 在一個(gè)地方把the_name錯(cuò)拼成teh_name,你就有機(jī)會(huì)在其它地方發(fā)現(xiàn)這個(gè)錯(cuò)誤。
如果所有其它的方法都失敗了
如果你正坐在那兒盯著一個(gè)錯(cuò)誤,并且不能指出是怎么回事(或者根本沒(méi)有發(fā)現(xiàn)錯(cuò)誤,但是因?yàn)槌绦虿荒苷_運(yùn)行,你知道存在錯(cuò)誤),你最好從計(jì)算機(jī)前走開(kāi)。去讀一本書(shū),在角落散散步,或者拿一杯可口的飲料 - 做些事,任何事,但不要去想程序或問(wèn)題。這種技術(shù)在某種情況下叫做“醞釀”,效果非常好。在你稍做休息和放松后,再試著找出錯(cuò)誤。你會(huì)得到一幅比較清晰的景象?!搬j釀”起作用是因?yàn)樗鼓銖乃季S混亂中解脫出來(lái)。如果沿著一條錯(cuò)路走太遠(yuǎn),你有時(shí)會(huì)發(fā)現(xiàn)無(wú)法轉(zhuǎn)身。這種情況下最好開(kāi)辟一條新路。我知道這會(huì)令人發(fā)火,但確實(shí)有效。真的!
如果上面的方法還不成功...
請(qǐng)求別人的幫助。有時(shí)你的思想會(huì)形成定式,只有換一種眼光才能洞察問(wèn)題之所在。在結(jié)構(gòu)化編程環(huán)境中,程序員們定期地互相復(fù)查別人的代碼。這可以適當(dāng)?shù)亟凶觥按a復(fù)查”,不僅可以幫助消除錯(cuò)誤,還可以得到更好的代碼。不要怕把你的 JavaScript代碼給別人看,它會(huì)使你成為更好的JavaScript程序員。
但是消除錯(cuò)誤的絕對(duì)最好的辦法是...
一開(kāi)始就創(chuàng)建沒(méi)有錯(cuò)誤的代碼。
-------------------------------創(chuàng)建沒(méi)有錯(cuò)誤的代碼---------------------------------------
編好程序的關(guān)鍵是程序是寫(xiě)給人的,不是寫(xiě)給計(jì)算機(jī)的。如果你能明白其他人或許會(huì)閱讀你的 JavaScript,你就會(huì)寫(xiě)更清晰的代碼。代碼越清晰,你就越不容易犯錯(cuò)誤。機(jī)靈的代碼是可愛(ài)的,但就是這種機(jī)靈的代碼會(huì)產(chǎn)生錯(cuò)誤。最好的經(jīng)驗(yàn)法則是 KISS,即Keep It Simple,Sweetie(保持簡(jiǎn)單,可愛(ài))。另一個(gè)有幫助的技術(shù)是在寫(xiě)代碼之前作注釋。這迫使你在動(dòng)手之前先想好。一旦寫(xiě)好了注釋?zhuān)憔涂梢栽谄湎旅鎸?xiě)代碼。
下面是一個(gè)用這種方法寫(xiě)函數(shù)的例子:
第一步:寫(xiě)注釋
第二步:填充代碼
這種先寫(xiě)注釋的策略不僅迫使你在寫(xiě)代碼前思考,而且使編碼的過(guò)程看起來(lái)容易些 - 通過(guò)把任務(wù)分成小的,易于編碼的各個(gè)部分,你的問(wèn)題看起來(lái)就不太象珠穆朗瑪峰,而象一群令人愉悅的起伏的小山。
最后... 總以分號(hào)結(jié)束你的每一條語(yǔ)句。
雖然并不是嚴(yán)格必需,你應(yīng)該養(yǎng)成以分號(hào)結(jié)束每一條語(yǔ)句的習(xí)慣,這樣可以避免這行后面再有代碼。忘了加分號(hào),下一行好的代碼會(huì)突然產(chǎn)生錯(cuò)誤。把變量初始化為“var”,除非你有更好的理由不這樣做。用“var”把變量局域化可以減少一個(gè)函數(shù)與另一個(gè)不相關(guān)函數(shù)相混淆的機(jī)會(huì)。
好了,既然你已經(jīng)知道了如何編碼,下面就讓我們學(xué)習(xí)怎樣使
你的JavaScript快速運(yùn)行。>>
---------------------------------------------------------
按速度優(yōu)化JavaScript代碼
1.限制循環(huán)內(nèi)的工作量
2.定制if-then-else語(yǔ)句,按最可能到最不可能的順序
3.最小化重復(fù)執(zhí)行的表達(dá)式
您可能感興趣的文章:
- Javascript調(diào)試工具(下載)
- javascript腳本調(diào)試方法小結(jié)
- 在IE,Firefox,Safari,Chrome,Opera瀏覽器上調(diào)試javascript
- js調(diào)試工具 Javascript Debug Toolkit 2.0.0版本發(fā)布
- ie 調(diào)試javascript的工具
- Javascript 調(diào)試?yán)?Firebug使用詳解六
- 調(diào)試JavaScript/VBScript腳本程序(IE篇)
- Aptana調(diào)試javascript圖解教程
- 兩個(gè)JavaScript jsFiddle JSBin在線調(diào)試器
- JavaScript 錯(cuò)誤處理與調(diào)試經(jīng)驗(yàn)總結(jié)
- javascript 在firebug調(diào)試時(shí)用console.log的方法
- 調(diào)試Javascript代碼(瀏覽器F12及VS中debugger關(guān)鍵字)
- 10個(gè)基于瀏覽器的JavaScript調(diào)試工具分享
- 利用瀏覽器的Javascript控制臺(tái)調(diào)試PHP程序
- 禁用JavaScript控制臺(tái)調(diào)試的方法
- JS高級(jí)調(diào)試技巧:捕獲和分析 JavaScript Error詳解
- JavaScript調(diào)試技巧之console.log()詳解
- javascript調(diào)試之DOM斷點(diǎn)調(diào)試法使用技巧分享
- 使用Chrome調(diào)試JavaScript的斷點(diǎn)設(shè)置和調(diào)試技巧
- 谷歌瀏覽器調(diào)試JavaScript小技巧
- JavaScript如何調(diào)試有哪些建議和技巧附五款有用的調(diào)試工具
相關(guān)文章
js模仿html5 placeholder適應(yīng)于不支持的瀏覽器
html5原生支持placeholder,對(duì)于不支持的瀏覽器(ie)可用js模擬實(shí)現(xiàn),不要走開(kāi),接下來(lái)為您詳細(xì)介紹實(shí)現(xiàn)方法2013-01-01
javascript中encodeURI和decodeURI方法使用介紹
encodeURI和decodeURI是成對(duì)來(lái)使用的,因?yàn)闉g覽器的地址欄有中文字符的話,可以會(huì)出現(xiàn)不可預(yù)期的錯(cuò)誤,所以可以encodeURI把非英文字符轉(zhuǎn)化為英文編碼,decodeURI可以用來(lái)把字符還原回來(lái)2013-05-05
判斷一個(gè)變量是數(shù)組Array類(lèi)型的方法
JavaScript中如何判斷一個(gè)變量是數(shù)組Array類(lèi)型呢?本文向大家提供一個(gè)比較不錯(cuò)的方法,可以說(shuō)是無(wú)懈可擊了2013-09-09
用JavaScript和jQuery實(shí)現(xiàn)瀑布流
本篇文章主要介紹了用JavaScript和jQuery實(shí)現(xiàn)瀑布流的方法,具有很好的參考價(jià)值。下面跟著小編一起來(lái)看下吧2017-03-03
layui 監(jiān)聽(tīng)表格復(fù)選框選中值的方法
今天小編就為大家分享一篇layui 監(jiān)聽(tīng)表格復(fù)選框選中值的方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-08-08
Javascript 異步加載詳解(瀏覽器在javascript的加載方式)
本文總結(jié)一下瀏覽器在 javascript 的加載方式,需要的朋友可以參考下2012-05-05

