## 前言
在js的代碼開發中,我簡單的總結出了以下規則,后面會陸續補充并且對規范進行分類。
1. js代碼建議保存到后綴名.js的文件中
2. js代碼不建議放在html中,原因有:不能被緩存,會增大網頁文件的大小,可維護性不高,會影響頁面的加載。另外腳本的lang(已棄用)以及type(默認是text/javascript)屬性都可以省略。
3. 縮進,建議使用空格,因為各個環境對tab的解釋不通,而空格可以在壓縮文件中統一被壓縮掉。
4. 每行控制在80個字符以內,如果超過請折行。
5. 注釋 :
注釋可以增加代碼的可維護性,尤其在項目交接的時候。
寫好注釋有利于團隊的集成開發。
在更新功能以及模塊時通過注釋進行補充說明。
寫有意義的注釋,關鍵位置的說明。
6. 變量聲明:
在所有的變量使用前進行聲明;
多個變量同時命名時,可以簡化用,分割同時命名;
變量命名,jq的變量以$開頭,比如常用的$this,私有變量以_開始;
變量沒有塊的概念;
注意全局變量與布局變量,避免使用全局變量,同時避免局部變量覆蓋全局變量。
在函數體內,注意函數變量的說明,函數內使用到的變量要在函數頭部進行盡量統一聲明,尤其很多入參或者出參的時候。
7. 函數聲明:
所有的函數應該在使用前被聲明;
函數聲明格式,函數名與左括號無間隔,右括號與方法體大括號有空格,大括號結束符與方法聲明行頭部對齊。(快捷鍵crtl+shift+f)
特別的,如果是匿名函數,應該在方法類型與小括號之間加空格。
8. 命名 :
變量名由26個大小寫引文字母以及下劃線組成,避免使用中文,不要再變量名中使用斜杠或者美元符號,不要把下劃線用作變量的第一個字符,它有時會用作對象的私有變量,大多數的變量或者方法名應該以小寫字母開頭。
全局變量應該全部大寫字母。
9. 語句 :
9.1 簡單語句
每一行語句最多只包含一條語句,吧分號放在每個簡單語句的結尾。注意每個變量或者對象的賦值語句也是簡單語句,應該以分號結尾。
js吧任何表達式都當一條簡單語句,會導致一些隱性的錯誤。如果自己沒加分號,那么js解釋器會自動添加分號,按照自己能讀懂的斷句。
9.2 復合語句
也稱為語句塊,被包在大括號內部。
內部的語句塊需要縮進四個空格,左大括號在起始行的結尾處,右大括號與左大括號所在行的開頭對齊。
大括號要在使用語句塊的時候使用,哪怕只有一句,這樣可以避免以后再添加語句的時候造成邏輯錯誤,比如if else 這樣的語句中,默認只對單行代碼有效 。
10. 標識 :
標識是可選的,只有在do,while,for,switch中使用。
11. return 語句
當返回語句只有一條返回值的時候,不用加小括號;
當返回語句多個值的時候,小括號。
當返回表達式的時候,應該控制在同一行,分號結尾。
12. 基本語句的格式,按照正確的句法,比如if,else,for,switch 等
13. 空白 :
相關程序之間添加空白行增強程序的可讀性。
每個控制結構,比如for循環的三個分支之間。
變量聲明時每個逗號之間。
14. 變量作用域
js沒有有塊級作用域,只有函數作用域。
15.
[] {} 的用法
使用直接量發來聲明對象和數組。
比如對象 var obj={} ;var arr=[]
16. eval
eval是最容易混亂使用的js函數,他可以執行內部入參的js函數或者表達式,可以直接解析變量。不建議使用 。
17. 不建議修改內建對象的原型鏈
內建對象的原型鏈 是比較好的標準 自己不要修改內建對象的相關方法 在內建對象的es5 es6 語法中有哪些
18. this關鍵字的使用場景 :
全局變量 ,觸發元素,構造器本身,定義域
19. 明確真值表
明智的使用真假判斷 (a==true)(a)
``` javascript
- logTruthyFalsy(true); // truthy
- logTruthyFalsy(1); // truthy
- logTruthyFalsy({}); // truthy
- logTruthyFalsy([]); // truthy
- logTruthyFalsy('0'); // truthy
- logTruthyFalsy(false); // falsy
- logTruthyFalsy(0); // falsy
- logTruthyFalsy(undefined); // falsy
- logTruthyFalsy(null); // falsy
- logTruthyFalsy(NaN); // falsy
- logTruthyFalsy(''); // falsy
```
20\. 判斷是否相等時候 采用=== 判斷包括類型的相等
21\. 盡量使用語法嚴格模式
消除代碼之中的不友好;代碼運行更快 ;保證運行的安全 ;為新版本的js做好鋪墊。
22\. 匿名函數的調用寫在匿名函數的內部
``` javascript
(function(argus){
}(argus))
```
## 補充
待補充...
- 前端入門
- 前端入職須知
- 前端自我定位
- pc與手機頁面差別
- 前端書單
- 前端種子計劃
- 前端技術棧
- ps
- ps入門階段
- html
- html入門
- html代碼規范
- meta
- table
- iframe
- a標簽詳解
- image
- html代碼審查工具
- h5專題
- h5入門
- h5新增屬性
- canvas畫布教程
- audio/video
- Geolocation
- Websockets
- Web storage
- Communication
- Web Workers
- requestAnimationFrame
- css
- css入門必學
- css代碼規范
- 項目字體規范
- css基本位置布局
- css常見樣式命名規則
- css代碼優化建議
- css常用樣式名
- css選擇器攻略
- css盒子模型的理解
- css屬性繼承與默認值
- css代碼審查工具
- css中常見的知識盲區
- css3新特性淺談
- css新特性了解
- border-radius
- background
- transform
- animation
- white-space
- css常用技術
- 文本兩端對齊
- css之浮動解決方案
- css優化建議
- 文本超出省略
- img-sprites
- rem布局教程
- 水平居中&垂直居中
- 固寬&變寬布局
- 寬高固定比例的盒模型
- 樣式預處理語言
- less教程
- sass教程
- postcss教程
- js
- javascript入門
- js代碼規范
- js基礎拓展
- js代碼審查工具
- js性能優化
- js基本語句
- 基本運算
- 基本語句語法
- js對象
- es6入門
- obj
- Array
- Date
- String
- Boolean
- Number
- Json
- RegExp
- Math
- function
- jquery入門
- jq核心思想
- jq基本語法
- jq插件庫匯總
- js常用技術
- break&continue區別
- js對日期轉換
- js控制運動-move.js
- 原生js-cookie語法
- ajax請求后回調
- 表單數據序列化
- zepto
- zepto入門
- 百度touchjs
- js編程
- 插件庫
- 功能性插件
- pdfjs
- wdatepicker
- qrcoder
- barcode插件
- photoviewer
- hammer.js
- echarts
- 交互組件
- layerjs
- java
- java入門
- java基本語句
- springMVC
- javaweb
- vm模板引擎
- freemarker
- maven教程
- mySql教程
- flex教程
- flex入門
- git教程
- git入門
- git分支
- git-tag管理
- git注意事項
- git-torise入門
- ide-git插件使用
- web
- web兼容
- web兼容思想
- pc端兼容適配文檔
- pc端兼容bug匯總
- ie兼容bug匯總
- 手機兼容bug匯總
- web安全
- jeecms
- web存儲
- app/h5組件
- 安卓教程
- ios教程
- 前端教程
- rubikx的教程
- 其他
- artTemplate
- tmod使用
- 跨域問題
- markdown教程
- 常用工具
- postman-api調試
- web常識
- 瀏覽器ua統計
- ui框架
- easyui
- bootstrap
- 入門推薦
- weui
- sui-pc
- sui-mobile
- layerUi