国产99久久精品_欧美日本韩国一区二区_激情小说综合网_欧美一级二级视频_午夜av电影_日本久久精品视频

最新文章專題視頻專題問答1問答10問答100問答1000問答2000關鍵字專題1關鍵字專題50關鍵字專題500關鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關鍵字專題關鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
問答文章1 問答文章501 問答文章1001 問答文章1501 問答文章2001 問答文章2501 問答文章3001 問答文章3501 問答文章4001 問答文章4501 問答文章5001 問答文章5501 問答文章6001 問答文章6501 問答文章7001 問答文章7501 問答文章8001 問答文章8501 問答文章9001 問答文章9501
當前位置: 首頁 - 科技 - 知識百科 - 正文

JavaScript開發規范要求(圖文并茂)_javascript技巧

來源:懂視網 責編:小采 時間:2020-11-27 20:49:51
文檔

JavaScript開發規范要求(圖文并茂)_javascript技巧

JavaScript開發規范要求(圖文并茂)_javascript技巧:本人在開發工作中就曾與不按規范來開發的同事合作過,與他合作就不能用愉快來形容了。現在本人撰寫此文的目的除了與大家分享一點點經驗外,更多的是希望對未來的合作伙伴能夠起到一定的借鑒作用。當然,如果我說的有不科學的地方還希望各路前輩多多指教。
推薦度:
導讀JavaScript開發規范要求(圖文并茂)_javascript技巧:本人在開發工作中就曾與不按規范來開發的同事合作過,與他合作就不能用愉快來形容了。現在本人撰寫此文的目的除了與大家分享一點點經驗外,更多的是希望對未來的合作伙伴能夠起到一定的借鑒作用。當然,如果我說的有不科學的地方還希望各路前輩多多指教。

本人在開發工作中就曾與不按規范來開發的同事合作過,與他合作就不能用“愉快”來形容了。現在本人撰寫此文的目的除了與大家分享一點點經驗外,更多的是希望對未來的合作伙伴能夠起到一定的借鑒作用。當然,如果我說的有不科學的地方還希望各路前輩多多指教。下面分條目列出各種規范要求,這些要求都是針對同事編碼毛病提出來的,好些行業約定的其它規范可能不會再提及。 1、保證代碼壓縮后不出錯

對于大型的JavaScript項目,一般會在產品發布時對項目包含的所有JavaScript文件進行壓縮處理,比如可以利用Google Closure Compiler Service對代碼進行壓縮,新版jQuery已改用這一工具對代碼進行壓縮,這一般會去掉開發時寫的注釋,除去所有空格和換行,甚至可以把原來較長的變量名替換成短且無意義的變量名,這樣做的目的是加快文件的下載速度,同時也減小網站訪問帶來的額外數據流量,另外在代碼保護上也起到了一點點作用,至少壓縮后的代碼即使被還原還是沒那么容易一下讀懂的。要想代碼能正確通過壓縮,一般要求語句都要以分號正常結束,大括號也要嚴格結束等,具體還要看壓縮工具的要求。所以如果一開始沒有按標準來做,等壓縮出錯后再回去找錯誤那是浪費時間。

2、保證代碼能通過特定IDE的自動格式化功能

一般較為完善的開發工具(比如Aptana Studio)都有代碼“自動格式”化功能,這一功能幫助實現統一換行、縮進、空格等代碼編排,你可以設置自己喜歡的格式標準,比如左大括號{是否另起一行。達到這個要求的目的在于方便你的開發團隊成員拿你代碼的一個副本用IDE自動格式化成他喜歡或熟悉的風格進行閱讀。你同事需要閱讀你的代碼,可能是因為你寫的是通用方法,他在其它模塊開發過程中也要使用到,閱讀你的代碼能最深入了解方法調用和實現的細節,這是簡單API文檔不能達到的效果。

3、使用標準的文檔注釋

這一要求算是最基本的,這有利于在方法調用處看到方法的具體傳參提示,也可以利用配套文檔工具生成html或其它格式的開發文檔供其他團隊成員閱讀,你可以嘗試使用jsdoc-toolkit。如果你自動生成的API是出自一個開放平臺,就像facebook.com應用,那么你的文檔是給天下所有開發者看的。另外編寫完整注釋,也更方便團隊成員閱讀你的代碼,通過你的參數描述,團隊成員可以很容易知道你編寫的方法傳參與實現細節。當然也方便日后代碼維護,這樣即使再大的項目,過了很長時間后,回去改點東西也就不至于自己都忘記了當時自己寫的代碼是怎么一回事了。

4、使用規范有意義的變量名

使用規范有意義的變量名可以提高代碼的可讀性,作為大項目開發成員,自己寫的代碼不僅僅要讓別人容易看懂。開發大項目,其實每個人寫的代碼量可能都比較大,規范命名,日后自己看回自己的代碼也顯的清晰易懂,比如日后系統升級或新增功能,修改起代碼來也輕松多了。如果到頭發現自己當初寫的代碼現在看不太懂了,那還真是天大的笑話了。

當然,使用有意義的變量名也盡量使用標準的命名,比如像這里:var me = this也許沒有var self = this好,因為self是Python中的關鍵字,在Python中self就是通常語言this的用法。再看下面一個例子,加s顯然比沒有加來的科學些,這樣可以知道這個變量名存的是復數,可能是數組等:

var li = document.getElementsByTagName('li')
var lis = document.getElementsByTagName('li')

5、不使用生偏語法

JavaScript作為一門動態腳本語言,靈活性既是優點也是缺點,眾所周知,動態語言不同層次開發人員對實現同樣一個功能寫出來的代碼在規范或語法上會存在較大的差別。不管怎么樣,規范編碼少搞怪,不把簡單問題復雜化,不違反代碼易讀性原則才是大家應該做的。

比如這語句:typeof(b) == 'string' && alert(b)應該改為:if (typeof(b) == 'string') alert(b),像前面那種用法,利用了&&運算符解析機制:如果檢測到&&前語句返回false就不再檢測后面語句,在代碼優化方面也有提到把最可能出現的情況首先判斷,像這種寫法如果條件少還好,如果條件較多而且語句也長,那代碼可讀性就相當差。

又比如:+function(a){var p = a;}( 'a')應該改為:(function(a){var p = a;})( 'a'),其實function前面的+號與包含function的()括號作用是一樣的,都是起運算優先作用,后者是常見且容易看明白的防止變量污染的做法,比如好些流行JavaScript框架就是采用后面這種方式。

再說個降低代碼可讀性的例子,如:function getPostionTxt(type){return type == 2 ? "野外" : (type == 3 ? "商城" : (type == 4 ? "副本" : null));}應該改成:function getPostionTxt(type){var typeData={"2":"野外","3":"商城","4":"副本"};if (typeData[type]) return typeData[type]; else return null;}。如果type是從0開始不間斷的整數,那么直接使用數組還更簡單,這種結果看起來就清晰多了,看到前面那種多層三元表達式嵌套頭不暈嗎。

6、不在語句非賦值地方出生中文

語句中不應該出現中文我想一般人都知道,雖然這樣做不影響程序運行,但是顯然有背行業標準要求,當然我們也不是在使用“易語言”做開發。關于這一個問題,我本來不想把它拿出來說的,但我確實遇到有人這樣做的,也不知道是不是因為他的英語實在太爛了,至少還可以用拼音吧,另外尋求翻譯工具幫忙也不錯的選擇。我舉例如下,像以下寫法出現在教學中倒還可以理解:

this.user['名字'] = '張三' 或者 this.user.名字 = '張三'

7、明確定義函數固定數量的參數

固定數量參數的函數內部不使用arguments去獲取參數,因為這樣,你定義的方法如果包含較多的腳本,就不能一眼看到這個方法接受些什么參數以及參數的個數是多少。比如像下面:
var $ = function(){return document.getElementById(arguments[0]);}應該改成:var $ = function(elemID){return document.getElementById(elemID);}

8、不必熱衷動態事件綁定

雖然知道事件可以動態綁定,比如使用addEventListener或者使用jQuery的bind方法,也知道采用動態事件綁定可以讓XHTML更干凈,但是一般情況下我還是建議直接把事件寫在DOM節點上,我認為這樣可以使代碼變得更容易維護,因為這樣做,我們在查看源代碼的時候就可以容易地知道什么Element綁定了什么方法,簡單說這樣更容易知道一個按鈕或鏈接點擊時調了什么方法腳本。

9、降低代碼與XHTML的耦合性

不要過于依賴DOM的一些內容特征來調用不同的腳本代碼,而應該定義不同功能的方法,然后在DOM上調用,這樣不管DOM是按鈕還是鏈接,方法的調用都是一樣的,比如像下面的實現顯然會存在問題:

function myBtnClick(obj)
{
 if (/確定/.test(obj.innerHTML))
  alert('OK');
 else if (/取消/.test(obj.innerHTML))
  alert('Cancel');
 else
  alert('Other');
}

確定取消

上面例子其實在一個函數內處理了兩件事情,應該分成兩個函數,像上面的寫法,如果把鏈接換成按鈕,比如改成這樣:,那么myBtnClick函數內部的obj.innerHTML就出問題了,因為此時應該obj.value才對,另外如果把按鈕名稱由中文改為英文也會出問題,所以這種做法問題太多了。

10、一個函數應該返回統一的數據類型

因為JavaScrip是弱類型的,在編寫函數的時候有些人對于返回類型的處理顯得比較隨便,我覺得應該像強類型語言那樣返回,看看下面的兩個例子:

function getUserName(userID)
{
 if (data[userID])
  return data[userID];
 else
  return false;
}

應該改為:

function getUserName(userID)
{
 if (data[userID])
  return data[userID];
 else
  return "";
}

這個方法如果在C#中定義,我們知道它準備返回的數據類型應該是字符串,所以如果沒有找到這個數據我們就應該返回空的字符串,而不是返回布爾值或其它不合適的類型。這并沒有影響到函數將來的調用,因為返回的空字符串在邏輯判斷上可被認作“非”,即與false一樣,除非我們使用全等于“===”或typeof進行判斷。

11、規范定義JSON對象,補全雙引號

使用標準肯定是有好處的,那么為什么還是有人不使用標準呢?我想這可能是懶或習慣問題。也許還會有人跟我說,少寫引號可以減輕文件體積,我認為這有道理但不是重點。對于服務器返回的JSON數據,使用標準結構可以利用Firefox瀏覽器的JSONView插件方便查看(像查看XML那樣樹形顯示),另外你如果使用jQuery做開發,最新版本jQuery1.4+是對JSON格式有更高要求的,具體的可以自己查閱jQuery更新文檔。比如:{name:"Tom"}或{'name':'Tom'}都應該改成{"name":"Tom"}。

12、不在文件中留下未來確定不再使用的代碼片段

當代碼調整或重構后,之前編寫的不再使用的代碼應該及時刪除,如果認為這些代碼還有一定利用價值可以把它們剪切到臨時文件中。留在項目中不僅增加了文件體積,這對團隊其它成員甚至自己都起到一定干擾作用,怕將來自己看回代碼都搞不懂這方法是干什么的,是否有使用過。當然可以用文檔注釋標簽@deprecated把這個方法標識為不推薦的。

13、不重復定義其他團隊成員已經實現的方法

對于大型項目,一般會有部分開發成員實現一些通用方法,而另外一些開發成員則要去熟悉這些通用方法,然后在自己編寫模塊遇到有調用的需要就直接調用,而不是像有些開發者喜歡“單干”,根本不會閱讀這些通用方法文檔,在自己代碼中又寫了一遍實現,這不僅產生多余的代碼量,當然也是會影響團隊開發效率的,這是沒有團隊合作精神的表現,是重復造輪子的悲劇。

比如在通用類文件Common.js有定義function $(elemID){return document.getElementById(elemID)}那么就不應該在Mail.js中再次出現這一功能函數的重復定義,對于一些復雜的方法更應該如此。

14、調用合適的方法

當有幾個方法都可以實現同類功能的時候,我們還是要根據場景選擇使用最合適的方法。下面拿jQuery框架的兩個AJAX方法來說明。如果確定服務器返回的數據是JSON應該直接使用$.getJSON,而不是使用$.get得到數據再用eval函數轉成JSON對象。如果因為本次請求要傳輸大量的數據而不得以使用$.post也應該采用指定返回數據類型(設置dataType參數)的做法。如果使用$.getJSON,在代碼中我們一眼能看出本次請求服務器返回的是JSON。

溫馨提示:jQuery1.4后,如果服務器有設置數據輸出的ContentType,比如ASP.NET C#設置 Response.ContentType = "application/json",那么$.get將與$.getJSON的使用沒有什么區別。

15、使用合適的控件存儲合適的數據

曾發現有人利用DIV來保存JSON數據,以待頁面下載后將來使用,像這樣:{ "name":"Tom"},顯然這個DIV不是用來界面顯示的,如果非要這樣做,達到使用HTML文件進行數據緩存的作用,至少改成用隱藏域來存這數據更合理,比如改成:

其實也可以利用window對象來保存一些數據,像上面的例子,我們可以在AJAX請求頁直接包含這樣的腳本塊:

聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

文檔

JavaScript開發規范要求(圖文并茂)_javascript技巧

JavaScript開發規范要求(圖文并茂)_javascript技巧:本人在開發工作中就曾與不按規范來開發的同事合作過,與他合作就不能用愉快來形容了。現在本人撰寫此文的目的除了與大家分享一點點經驗外,更多的是希望對未來的合作伙伴能夠起到一定的借鑒作用。當然,如果我說的有不科學的地方還希望各路前輩多多指教。
推薦度:
標簽: 開發 js 規范
  • 熱門焦點

最新推薦

猜你喜歡

熱門推薦

專題
Top
主站蜘蛛池模板: 国产高清一区 | 久久一区二区三区精品 | 精品一区二区三区四区电影 | 日本a中文字幕 | 欧美成人精品在线 | 亚洲国产精品一区二区久 | 国产高清在线播放免费观看 | 国产精品日韩欧美一区二区三区 | 一区二区三区久久 | 国产高清不卡码一区二区三区 | 精品一区二区三区四区 | 国产日韩欧美亚洲综合在线 | 国产成人精品三级在线 | 久久久一区二区三区不卡 | 狠狠干欧美 | 欧州人曾交| 久久频道毛片免费不卡片 | 国产91精品久久久久久 | 欧美亚洲国产精品 | 欧美福利一区二区三区 | 国产精品久久久久久久久免费 | 国产成人在线看 | 国产精品免费观看视频 | 国产精品成人一区二区1 | 免费看黄色毛片 | 国产99视频精品免费观看7 | 国产一区三区二区中文在线 | 亚洲欧美国产精品 | 久久国产高清 | 不卡二区 | 91精品91久久久久久 | 国内一区二区 | 国产高清一级在线观看 | 欧美综合在线视频 | 欧美成人h精品网站 | 久久精品一区二区影院 | 国产一级二级三级 | 亚洲 欧美 中文 日韩专区 | 欧美激情一区二区三区四区 | 精品国产91久久久久久久 | 韩日一区二区三区 |