[情報] google javascript style guide

看板Ajax作者 (自立而後立人)時間10年前 (2013/10/30 12:29), 編輯推噓12(12015)
留言27則, 7人參與, 最新討論串1/1
Google JavaScript Style Guide http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml 我摘一些重點,理由請自己讀原文 @ 變數 一定要使用 var 定義 @ 常數 使用大寫字母、底線分隔 NAMES_LIKE_THIS 使用 @const 註解 @ 總是補上分號可以使用巢狀函式 (nested function) @ 不要在 block 內定義函式 如 if(check){ function test(){} } (註 block 不能定義 function 跟允許使用 nested function 沒有衝突, block 指的是除 function 以外的 {} 之間 ) @ 可以使用 exception ( try-catch) @ 可以使用自定義 exception (custom exception) ( throw ) @ Standards features 總是優先使用標準 feature @ 不要為標準資料型態建立包裝 (Wrapper objects for primitive types) 如用 Boolean 封裝 true, false ,像這個例子就會造成問題 var x = new Boolean(false); if (x) { alert('hi'); // Shows 'hi'. } @ 不建議使用多層的 prototype 繼承鏈 (Multi-level prototype hierarchies) (但可以用 google closure 的 goog.inherits ) @ 物件成員跟方法的定義 Method and property definitions 建構式定義方式 /** @constructor */ function Foo() { this.bar = value; } 成員定義方式建議使用 Foo.prototype.bar = function() { /* ... */ }; @ 刪除物件屬性 (delete) 建議使用 this.foo = null. 形式 用 Foo.prototype.dispose = function() { this.property_ = null; }; 但不要用 Foo.prototype.dispose = function() { delete this.property_; }; (因為前者效能比後者快很多) @ Closures 可以使用,但要小心 (memory leak issue) @ eval 只用在讀取程式碼、 REPL (Read–eval–print loop) @ with :不要使用 @ this :只在建構子或物件函式裡面使用 @ for-in loop : 只用來作為列出所有 object 裡面的 key 使用 (換言之,不能拿來 iterate 陣列) @ 不要拿 array 來當 object 用 @ 不要用多行字串表達式 Multiline string literals 不要用類似這種的表達法 var str= "line1 \ line2 \ line3 "; @ 使用陣列跟物件表達式 ([],{}) Array and Object literals 比起 new Array() 、建議使用 [] 比起 new Object() 、 建議使用 {} @ 不要修改內建物件的 prototype (Modifying prototypes of builtin objects) @ 不要使用 IE 專用判斷式(Internet Explorer's Conditional Comments) 不要用這種判斷式 /*@cc_on if(rule) { } */ @ 命名 一般來說,使用 functionNamesLikeThis, function 名稱首字小寫、駱駝式 variableNamesLikeThis, 變數名稱也是首字小寫 ClassNamesLikeThis, 類別名稱首字大寫 EnumNamesLikeThis, Enum 首字大寫 methodNamesLikeThis, method 首字小寫 CONSTANT_VALUES_LIKE_THIS, 常數全大寫、底線分隔 foo.namespaceNamesLikeThis.bar, namespace 首字小寫 filenameslikethis.js js 檔名全小寫 物件屬性與資料 private properties 的資料請用底線開頭 protected properties 資料不要用底線結尾(跟 public 一樣) /* .... 未完...下一篇待續 ....*/ -- 之間的世界,反抗軍啟蒙軍的交集 帶著 Android 去旅行、去發現 在身邊渾然不覺的 另一個世界。 全世界,都是我們的 足跡與遊樂場。 ~ The world around you is not what it seems. ~ http://ingress.tw -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 61.230.20.186

10/30 13:12, , 1F
javascript裡的protected scope是指?
10/30 13:12, 1F

10/30 13:16, , 2F
就是由closure存取區域變數吧?
10/30 13:16, 2F

10/30 13:20, , 3F
不過看文件內要提的應該是命名規則,沒強調變數的scope
10/30 13:20, 3F

10/30 13:37, , 4F
protected scope 指的是繼承體系下的 protected
10/30 13:37, 4F

10/30 13:37, , 5F
簡言之,就是讓子類別存取用的變數跟自己使用的變數
10/30 13:37, 5F
把 scope 修正為 properties ※ 編輯: TonyQ 來自: 61.230.20.186 (10/30 13:39)

10/30 15:07, , 6F
講properties我就懂了...scope是要怎麼設protected啊XD
10/30 15:07, 6F

10/30 15:45, , 7F
那是我在 java 世界的習慣講法啦 XD
10/30 15:45, 7F

10/30 15:46, , 9F
像這篇用的論述,把 member variable設成 protected/private
10/30 15:46, 9F

10/30 15:46, , 10F
不過在 javascript 裡面是有名無實就是了,只是標注他是
10/30 15:46, 10F

10/30 15:46, , 11F
private ,不是真的實質上能限制不給人存取,而是要說,你改
10/30 15:46, 11F

10/30 15:46, , 12F
了他我不會負責的,有種改就要有種收拾。XD
10/30 15:46, 12F
※ 編輯: TonyQ 來自: 61.230.20.186 (10/30 15:47)

10/30 15:48, , 13F
javascript可以靠closures弄出private效果啦...雖然基
10/30 15:48, 13F

10/30 15:49, , 14F
本上不會這樣弄....(把method都放closure裡面)
10/30 15:49, 14F

11/01 02:34, , 15F
11/01 02:34, 15F

11/01 08:37, , 16F
推 不過命名那邊 method 跟 function 的差異是?
11/01 08:37, 16F

11/01 09:26, , 17F
method是指掛在物件上的方法 function不是
11/01 09:26, 17F

11/01 09:26, , 18F
舉例來說 array.forEach是method alert是function
11/01 09:26, 18F

11/01 09:43, , 19F
原來如此 @@
11/01 09:43, 19F

11/01 09:50, , 20F
因為js的fn可以亂綁this 這定義可以再嚴一點
11/01 09:50, 20F

11/01 09:51, , 21F
function裡有用到this且會因this有變化的才叫method
11/01 09:51, 21F

11/01 11:22, , 22F
上面這個定義太糊了 就意義上的 member function 就行了
11/01 11:22, 22F

11/01 14:14, , 23F
嗯 我說的再嚴一點是我個人的理解 一般論就是我一開始
11/01 14:14, 23F

11/01 14:14, , 24F
講的掛在物件上的都算
11/01 14:14, 24F

11/05 19:39, , 25F
alert 也是掛在 window 下面啊= =||
11/05 19:39, 25F

11/05 21:21, , 26F
掛在根物件上的不算吧
11/05 21:21, 26F

01/09 15:25, , 27F
01/09 15:25, 27F
文章代碼(AID): #1IS8ivUH (Ajax)
文章代碼(AID): #1IS8ivUH (Ajax)