從javascript語言本身談項目實戰

來源:互聯網
上載者:User

從javascript語言本身談項目實戰
dulao5 2005-1-15

隨著ajax的升溫,javascript越來越得到人們的重視。重要的是,ajax在一定程度上帶來了web軟體架構上的變化,人們把越來越多的功能分配到用戶端實現,javascript子項目規模越來越大。如何更高效的使用javascript,如何更科學的組織javascript,如何更順利的保證項目進展?我想就我的經驗談一點淺見。

一。 開發人員需要認真學習javascript語言本身
由於javascript是“世界上最被誤解的語言”, 大部分人對javascript文法並沒有全面瞭解過,只是憑藉看起來很像c或者java的關鍵字按照自己的理解寫javascript代碼。其實 javascript是一種很獨特的語言,和c++/java有非常大的區別,要想用javascript做大一些的項目,開發人員必須老老實實的學習 javascript的文法。真正掌握了文法後,我們才不會把delete看成釋放記憶體對象,才不會為到底參數傳遞是值傳遞還是引用傳遞而煩惱。真正理解了javascript的基於原型的OO方式,才可能寫出具有良好架構的javascript程式。
《javascript權威指南》是一本最合適的書,鄭重推薦。另外ECMA262 文檔可以作為參考。網上流行的jscript手冊chm版本使用起來比較方便,不過這是微軟的jscript實現,和標準的javascript略有區別,使用時應該注意上面的註腳資訊。關於javascript的原型和OO,網上已經有很多文章介紹了,在此不再多說。

二。 良好的代碼來源於良好的設計
只有設計優良,代碼才會寫的漂亮。現在的javascript子項目已經不是以前web項目中的“邊角料”和散兵遊勇了,在較大的ajax項目內, javascript將非常複雜,ajax的非同步模型也和以前順序執行的程式設計有所區別。所以建議做javascript前首先做好設計。推薦使用用例驅動的方式,把用例分析清楚,以便全域考慮所有可能的頁面互動過程,繪出頁面內一些對象之間的互動圖,分析一些資料對象的狀態,作出精細的 javascript設計。

三。 使用設計模式,複用其他領域的設計經驗
如果javascript非常複雜,可以考慮使用一些模式。我想大部分做javascript的開發人員都不是“javascript科班”出身吧:) 掌握了javascript的語言本質,就可以複用我們在其他領域的經驗了。使用javascript架構或者ajax架構,使用單例模式做一個全域的資料緩衝池,或者使用觀察者模式把介面對象和資料對象分離,使用命令模式實現使用者的操作隊列等等。

四。 調試代碼的技巧
javascript的代碼不太好調試,這是由於:

  • 一般的開發人員對javascript語言本身不太精通。也就是上面提到的。
  • web項目包含較多的因素,複雜性加劇。服務端指令碼、模板、html、js等很多環節都可能增加調試難度。
  • 瀏覽器存在相容性問題。有可能在一個細節問題上IE、Mozilla、opera等瀏覽器都有差異。
  • 工具的缺乏。雖然mozilla的jsdebugger非常好用(還有bug,比如eval時調試器有些問題),但是其他瀏覽器環境下調試工具就不怎麼樣了。ms系統內建的script debug工具調試本地代碼還可以,直接調試網站js代碼錶現欠佳。opera除了javascript控制台外我沒有找到其他調試工具。

在此我推薦幾個調試技巧:

  1. 使用Mozilla firefox的jsdebugger外掛程式。這個我不再多說了,最經典的js調試工具。線上調試遠端站台的javascript效果非常棒。
  2. 把問題隔離,建立本地的html檔案和js檔案,使用ms script debug調試工具來調試。如果js模組比較獨立,可以使用這個工具的。如果寫hta的項目,這個工具當然是首選了。
  3. httpWatch 這是一個ie下的外掛程式,非常好用,能夠監視ie中的任何http會話,並能夠看到http會話的原文。可以通過這個工具瞭解你的程式有沒有和伺服器產生會話,參數&返回的資料到底是什麼。
  4. 在網頁內建立用於調試的textarea
    可以在網頁內建立一個textarea來接受你想啟動並執行js語句,然後加一個按鈕使用js的eval函數執行你輸入的代碼。
    這種方式非常適合線上調試,網頁出錯後寫代碼輸出頁面內的對象值。建議寫一些dump工具函數配合使用,效果更佳。
    我非常喜歡這種方式,可以隨時使用開關開啟頁面內隱藏的textarea進行調試,感覺很像給一台伺服器接上了終端,然後使用shell可以做任何事情:) 函數可以在這裡重新定義,可以任意操作介面中的任何元素,調用任何對象的任何函數,輸出任何你需要的運行時刻值。
  5. 使用異常(exception)和斷言(assert)
    使用try{}catch(e){}結構不光可以屏蔽出錯資訊,讓介面更友好。我們的程式可以使用異常、拋出異常來構建一種更好的出錯處理機制。
    有這樣一個故事,我在使用string.localeCompare函數時隨手寫了這樣的代碼:
    var iRe = str1.localeCompare(str2);
    switch(iRe){
    0: return ....
    1: return ....
    -1:return ....
    defalut:throw "error:localeCompare return other value"
    }
    寫完就忘了,沒想到我的同事在linux下使用firefox時,異常被拋出了,然後我們得知:linux firefox下localeCompare返回的不只是0/1/-1,而是返回一個具體值.
    這個異常拋出有效檢測出了代碼的不完美。

    firefox下的異常dump後能得到較為詳細的調用棧資訊,這一點非常好。IE的異常資訊沒有這麼詳細。

    異常和斷言也可以結合成為一個非常有效調試工具。
    斷言(assert)是在其他語言中的一種很有效調試工具,常常以這種形式出現:
    assert(<條件>);
    在程式處於debug狀態,當條件為假時,系統中止運行並報告這個斷言。由於斷言是我們自己定義的,所以我們可以很容易的判斷出出錯的地方,進而找到bug所在。
    javascript語言沒有提供宏,也沒有提供assert,我們可以這樣類比
    if(_is_debug) assert = function(expression , strLable){
    if( !expression ) throw Error(strLable);
    }
    else assert = function(){};//_is_debug是一個全域變數
    這樣可以實現在發生"不可能的事情"的時候,讓程式在偵錯模式下拋出異常,在發布版本中不作理會。

    可以這樣輸出當前棧的調用資訊,彌補剛才提到的IE中異常對象沒有棧資訊的缺陷:
    function callStackInfo(){
    var s="",line="";
    var cer=arguments.callee.caller;
    while(cer){
    var sf=cer.toString();
    s+=line+sf.substring(sf.indexOf('function'),sf.indexOf('{'))+"\n";
    line=".."+line;
    cer=cer.caller;
    }
    return s;
    }

本文只就javascript在web開發,特別是在ajax方面的開發做了一些討論,主要在於管窺如何更好的使用“純javascript”。web開發還有很多其他方面,比如xml和Dom等實際上和javascript息息相關,但是本文沒有涉及,還請見諒。歡迎各位朋友就我的討論多提意見。
--
-------------------------------------------------------------------
dulao5 敬上

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.