JavaScript編碼規范知識點有哪些

這篇文章主要介紹“JavaScript編碼規范知識點有哪些”，在日常操作中，相信很多人在JavaScript編碼規范知識點有哪些問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”JavaScript編碼規范知識點有哪些”的疑惑有所幫助！接下來，請跟著小編一起來學習吧！

1. 變量命名規范

變量名包括全局變量，局部變量，類變量，函數參數等等，他們都屬于這一類。

基本規范

變量命名都以類型前綴+有意義的單詞組成，單詞首字母都需要大寫。例如：sUserName，nCount。

前綴規范

每個局部變量都需要有一個類型前綴，按照類型可以分為：

s：表示字符串。例如：sName，sHtml；

n：表示數字。例如：nPage，nTotal；

b：表示邏輯。例如：bChecked，bHasLogin；

a：表示數組。例如：aList，aGroup；

r：表示正則表達式。例如：rDomain，rEmail；

f：表示函數。例如：fGetHtml，fInit；

o：表示以上未涉及到的其他對象，例如：oButton，oDate；

例外情況：

1：作用域不大臨時變量可以簡寫，比如：str，num，bol，obj，fun，arr。

2：循環變量可以簡寫，比如：i，j，k等。

為什么需要這樣強制定義變量前綴？正式因為javascript是弱語言造成的。在定義大量變量的時候，我們需要很明確的知道當前變量是什么屬性，如果只通過普通單詞，是很難區分的。

例如：

var group = [];   group.name = 'myGroup';   /****   some code   ***/ //這時候你還能一眼就看出來group是什么嗎？

又例如：

var checked = false;   var check = function(){       return true;   }   /**   some code   **/ if(check){//可能將checked寫成check，由于不能很快速的發現check是函數，造成邏輯錯誤       //do some thing   }

如果我們寫成：

var bChecked = false;   var fCheck = function(){       return true;   }   /**   some code   **/ if(bChecked){       // do some thing   }   if(fCheck()){       // do other thing   }

就清楚很多了。

全局變量以及常量規范

網易郵箱前端是基于“類”的概念來來開發javascript的（稍后會專門介紹），每個類定義都是在一個閉包函數中，除了在window下有類的定義而外，只允許有兩種變量定義在全局，那就是全局變量和常量。

全局變量使用g作為前綴，定義在window下。例如gUserName，gLoginTime。

某些作為不允許修改值的變量認為是常量，全部字母都大寫。例如：COPYRIGHT，PI。常量可以存在于函數中，也可以存在于全局。

看個例子就 很容易明白為什么要這樣定義了：

var userName = "dongua";   function checkName(userName){       //存在函數參數userName以及全局變量userName,如果要比較兩個值是否相等，必需寫為       return window.userName == userName   }

如果使用了全局變量的前綴，就十分清晰了。

2. 函數命名規范

統一使用動詞或者動詞[＋名詞]形式，例如：fGetVersion()，fSubmitForm()，fInit()；涉及返回邏輯值的函數可以使用is，has等表示邏輯的詞語代替動詞。

如果有內部函數，使用__f+動詞[+名詞]形式，內部函數必需在函數***定義。例如：

function fGetNumber(nTotal){       if(nTotal<100){     nTotal = 100;      }    return __fAdd(nTotal);          function __fAdd(nNumber){     nNumber++;     return nNumber;    }   }   alert(fGetNumber(30));//alert 101

對象方法實現

對象方法命名使用 f+對象類名+動詞[+名詞]形式；例如 fAddressGetEmail

事件響應函數

某事件響應函數命名方式為觸發事件對象名＋事件名或者模塊名＋觸發事件對象名＋事件名，例如：fDivClick()，fAddressSubmitButtonClick()

3.其他注意事項

1：所有命名***使用英語表示。

2：所有變量名應該明確而必要，盡量避免不必要的容易混淆的縮寫。

3：netease.events.mouse.Handler，而不是 netease.events.mouse.MouseEventHandler。

4：對應的方法應該使用對應的動詞，例如：get/set, add/remove, create/destroy, start/stop, insert/delete, begin/end。

5：應該避免雙重否定意義的變量，例如：bIsNotError, bIsNotFound，不可取。

6：變量應該在最小的范圍內定義，并盡可能的保持最少的活動時間。

7：循環變量***在循環中定義。例如for(var i=0,m=10;i<m;i++){ do something}。

8：盡量避免復雜的條件語句，可以使用臨時的boolean變量代替。

9：一定要避免在條件中執行語句，例如：if((i=3)>2){}，不可取。

10：不要在代碼中重復使用相同意義的數字，用一個變量代替，比如 nTotal=100; num= total。

網易郵箱頁面在window只允許定義三種變量&mdash;&mdash;1：全局變量；2：常量；3：類。任何業務邏輯都需要通過類方法或者示例方法實現。前兩種變量在之前文章中已經介紹，在此不再累述，接下來詳細介紹類定義和使用的規范。

定義類是通過一個閉包完成的：

(function(){     //***步：引入存在的類。引入support類     var Support = window.Support;          //$是網易郵箱基礎庫“base”的引用稍后會介紹     //第二步：定義類?？梢哉J為返回了一個類定義 function(){}，并在window下定義一個Image類     var Image = $.createClass("Image");          //可以認為是jQuery的extend方法          //第三步：定義類屬性/方法定義     $.Object.extend(Image,{      _language : null,   //內部屬性      getSize  : fImageGetSize     });     //第四步：定義實例屬性/方法定義     $.Object.extend(Image.prototype,{      name  : null,      url   : null,      ext   : null,      width  : 0,      height  : 0,      setName  : fImageSetName,      getName  : fImageGetName,      init  : fImageInit     });     //第五步：方法實現          function fImageGetSize(nWidth,nHeight){      return nWidth*nHeight;     }          function fImageSetName(sName){      var oImage = this;      oImage.name = sName;     }          function fImageGetName(){      var oImage = this;      return oImage.name;     }          function fImageInit(sUrl){      var oImage = this;      oImage.url = sUrl;      oImage.ext = Support.getExt(sUrl);      oImage.width = Support.getWidth(sUrl);      oImage.height = Support.getHeight(sUrl);     }         })();

我們可以看到，這個閉包完成了以下幾件事情：

1.引入這個類需要用到的其他類。

2.定義這個類。

3.定義類的屬性和方法。

4.定義類的實例屬性和方法。

5.類和實例方法的實現。

在命名上，我們遵循了一下規則：

1.類名***字母必需大寫，例如Image，Support等。

2.屬性名需要是有意義的名詞，首字母小寫，例如oImage.width。

3.方法名需要是有意義的動詞[+名詞]，首字母小寫，例如Support.getWidth

4.如果不希望被其他方法調用，需要在屬性或者方法名前面加“_”，例如oImage._language

5.如果不希望被子類調用，需要在屬性或者方法名前加“_”，例如oImage.__fire()

這里需要特別說明以下幾點：

1.方法的定義不是通過匿名函數來定義，而是集中在類定義的下面來實現。這樣的好處是能在最開始將類的屬性方法定義都羅列出來，便于通過源碼查看到對應屬性和方法。

2.在類/實例方法中，使用局部變量代替this。this不是一個好的玩意兒，一不小心就會被this搞暈。使用局部變量能夠盡量避免這樣的問題，也能夠在壓縮混淆的時候效果更好。

3.在實際開發過程中，每個類定義都單獨一個js實現。

到此，關于“JavaScript編碼規范知識點有哪些”的學習就結束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習，快去試試吧！若想繼續學習更多相關知識，請繼續關注億速云網站，小編會繼續努力為大家帶來更多實用的文章！