O3noBLOG

前陣子收集整理了一些和前端相關的 Coding Style 和 Guideline，整理一下放上來。

首先是 Google 的 JavaScript Coding Style，我很推薦這份規範，裡面的規範數量不少，我覺得其他幾份比較缺乏的變數命名原則在這份規範內就可以找到，更棒的是每條都有詳細的解釋，如果有想要訂規範又不想花太多時間人力來訂的話，我是建議可以直接拿 Google 的這份來用。

第二份是 jQuery 核心開發用的 jQuery Core Style Guideline ，因為已經有了 Google 的那份規範，這份我覺得就看過就好，其實 JavaScript 的一些開發準則都大同小異，這份規範涵蓋的內容比起 Google 的，要小上不少，比較特別的是有要求程式碼要能通過 JSLint 的檢查，JSLint 是我蠻喜歡的檢查工具，雖然檢查的項目很多很煩，不過所有的檢查項目都是有原因的。講到 jQuery 的 Core Style Guideline 就一定要提一下 #8926 這個 Issue，有人提報說 jQuery 送的活動紀念 T-shirt 上面印的程式碼沒有符合 Core Style Guideline，而且還是 blocker 等級的 issue :P。

接下來幾份規範文件就不是單純只針對 JavaScript 的了。首先是 isobar 的 Code Standard ，這份文件其實很全面，不只是 HTML、JavaScript、CSS 而已，還有親和力、效率、SEO 等等的建議和規範，甚至還有推薦的工具，而且文件有持續在更新，內容相當充實，現在看到的版本就比我當初看到的時候多了不少內容。

然後是 Mozilla 的 Frontend Code Standard， Mozilla 因為組織目標的關係，所以有些部分比較有趣，大方向就是朝著推廣和自由的方向前進，所以有規定像是不同 OS 不同瀏覽器的支援程度，所有專案的網站都要有多國語言支援，甚至是右到左書寫的文字也要顧到等等，有一些比較像是網站需求而不是規範性質的內容混在裡面，以前看的時候好像還有規定影音檔案也不能用商業的格式。除了這份文件外，Mozilla 另外還有一份 Securing Code Guideline ，整篇都是安全性相關的東西，有興趣的可以看看。

這些程式寫作規範除了有由公司或組織發表外，也是有以個人為單位發表的，Tait Brown 最近就發表了一份 Front End Development Guidelines，這份規範的內容就比較單純在 HTML、JavaScript、CSS 這三塊，內容我大概看過覺得還不錯，而且也不會太長，很適合新手使用。另外還有一份也很適合新手看的，也是放在 Github 上的教學文件，是由 Ivo Wetzel 和 Zhang Yi Jiang 做的 JavaScript Garden ，不過這份算是教學文件，而不是規範性質的文件。

其它的，還有一份是 Drupal 的 JavaScript Coding Standards 比較沒什麼特色就不另外介紹，Dojo 的則只能在 archive.org 裡面挖。國內的話相關資源就很少了，目前我只知道有 JosephJ 提供他在 D-Link 那邊建立的 前端開發規範 ，如果還有其他人知道國內有哪裡有類似的資源有公開的話，還請不吝告知。

文章最後要介紹的是大師推薦的 Coding Style 參考資料，首先是 gugod 大師，據說他在今年 OSDC 推薦的是 The Elements of Programming Style ，是本 1978 年出版的書，當然內容應該就如書名一樣，不過我還沒時間看就是。另外一位大師就更厲害了，Douglas Crockford 在他的 The Elements of JavaScript Style (Part 2) 提到了 The Element of Style 這本 1918 年出版的英文寫作經典，要從文章寫作去連接到程式的編寫風格，我還真是到不了這層高度啊～～

jQuery 1.6.1 釋出了，主要的修改就是讓我前一篇提到的 attr() 可以像下相容，如果本來因為 attr() 變動的關係不敢升上 1.6 的話，現在可以試試看 1.6.1 。

jQuery 1.6 前兩天剛出來，改變不少，其中我覺得影響最大的就是 attr() 和 prop() 這兩個東西了，attr 變成完全是依照 HTML 原始碼的內容回傳東西，所以像是 checkbox 標籤的 checked 屬性：

<input type="checkbox" checked>

以前用 attr 會傳回 true，但是現在會傳回空字串，因為他沒有設定內容，如果要向以前一樣使用，變成要改用 prop 來純取屬性了，我用 jsFiddle 作了個簡單範例給大家看看：

順便趁機問問大家意見，attribute 和 properties 同時出現時，中文翻譯要怎樣區別呢？