javascript書寫規(guī)范

1、Javascript書寫規(guī)范：1. 文件編碼統(tǒng)一為utf-8；2. 書寫過程過, 每行代碼結(jié)束必須有分號；3. 庫引入: 原則上僅引入jQuery庫；4. 變量命名: 以下劃線鏈接每個單詞，類型_變量名；s：表示字符串；n：表示數(shù)字；b：表示邏輯；a：表示數(shù)組；r：表示正則表達(dá)式；f：表示函數(shù)；o：表示以上未涉及到的其他對象；變量在作用域的頂部申明。5.常量：全部大寫，以下劃線分隔  如網(wǎng)站的URL，域,圖片目錄路徑，js和css用到的目錄路徑；6. 類命名: 首字母大寫, 駝峰式命名. 如 Comment;7. 函數(shù)命名: 首字母小寫駝峰式命名. 如getUserName();8.

2、類中私有方法，以下劃線+方法名標(biāo)注,私有方法不能在類外被調(diào)用。9. 命名語義化, 盡可能利用英文單詞或其縮寫；10. 代碼結(jié)構(gòu)明了化, 加適量注釋. 提高函數(shù)重用率；1)大功能區(qū)塊的功能描述(類，函數(shù))/*功能描述參數(shù)描述返回值*/2)單行的注釋(放在行末尾)/注釋11. 注重與html分離, 減小reflow, 注重性能.12.Dom中自定義的class，以j_classname的形式13.把外部JavaScript文件放在HTML底部,</body>的前面14.優(yōu)化循環(huán)(循環(huán)體中若有Dom操作，應(yīng)該把Dom操作提到循環(huán)體外；在同一作用域內(nèi)，Dom選擇賦值給一局部變量。)15.單

3、引號和雙引號為了避免混亂，我們建議在HTML中使用雙引號，在JavaScript中使用單引號。/html<img src=" />/JavaScript<script type="text/javascript">document.write('<p>');</script>/一段混用的jQuery代碼$('h1').after('<div id="content"><h2>目錄</h2><ol></ol

4、></div>');16.使用更簡單的格式來寫innerscript/早期的代碼可能是這樣的<script type="text/javascript" language="javascript">.</script>/現(xiàn)在不用language屬性了<script type="text/javascript">.</script>17.總是檢查數(shù)據(jù)要檢查你的方法輸入的所有數(shù)據(jù)，一方面是為了安全性，另一方面也是為了可用性。用戶隨時隨地都會輸入錯誤的數(shù)據(jù)。這不是因為

5、他們蠢，而是因為他們很忙，并且思考的方式跟你不同。用typeof方法來檢測你的function接受的輸入是否合法。18.避免混入其他技術(shù),js不直接控制css詳細(xì)的設(shè)置，可控制classname19.避免全局變量（類名空間App.dialog.）全局變量和全局函數(shù)是非常糟糕的。因為在一個頁面中包含的所有JavaScript都在同一個域中運(yùn)行。所以如果你的代碼中聲明了全局變量或者全局函數(shù)的話，后面的代碼中載入的腳本文件中的同名變量和函數(shù)會覆蓋掉（overwrite）你的。/糟糕的全局變量和全局函數(shù)var current = null;function init().function change

6、().function verify().解決辦法有很多，Christian Heilmann建議的方法是：/如果變量和函數(shù)不需要在“外面”引用，那么就可以使用一個沒有名字的方法將他們?nèi)及饋怼?function()  var current = null;  function init().  function change().  function verify().)();/如果變量和函數(shù)需要在“外面”引用，需要把你的變量和函數(shù)放在一個“命名空間”中/我們這里用一個function做命名空間而不是一個var，因為在前者中聲明function更簡單

7、，而且能保護(hù)隱私數(shù)據(jù)myNameSpace = function()  var current = null;  function init().  function change().  function verify().  /所有需要在命名空間外調(diào)用的函數(shù)和屬性都要寫在return里面  return    init:init,    /甚至你可以為函數(shù)和屬性命名一個別名    set:change  ();20.聲明變量的話，總

8、是用varJavaScript中的變量可能是全局域或者局部域，用var聲明的話會更加直觀。21.避免使用eval()方法(ajax數(shù)據(jù)請求驗證)JavaScript中的eval()方法是在運(yùn)行時把任何代碼當(dāng)作對象來計算/運(yùn)行的方法。實際上由于安全性的緣故，大部分情況下都不應(yīng)該用 eval()，總是有一種更“正確”的方法來完成同樣的工作的?；驹瓌t是，eval is evil，在任何時候都不要用它，除非你是一個老手，并且知道你不得不這樣做。22.不要偷懶省略”和從技術(shù)上說，你可以忽略很多花括號和分號。/雖然看上去很不對頭，大部分瀏覽器都能正確解析這段代碼if(someVariableExists

9、)  x = false/這個代碼看上去更不對頭了，咋眼一看似乎下面的句都被執(zhí)行了/實際上只有x=false在if中if(someVariableExists)   x = false   anotherFunctionCall();所以，要記住的原則是：1.永遠(yuǎn)不要省略分號；2.不要省略花括號，除非在同一行中。/這樣是OK的if(2 + 2 = 4) return 'nicely done'23.獲取對象屬性的時候用方括號而不是點號在JavaScript中取得某對象的屬性有兩種方法：/點號標(biāo)記MyOperty

10、/方括號標(biāo)記MyObject"property"如果是用點號標(biāo)記取得對象的屬性，屬性名稱是硬編碼，無法在運(yùn)行時更改；而用方括號的話，JavaScript會求得方括號內(nèi)值然后通過計算結(jié)果來求得屬性名。也就是說用方括號標(biāo)記的方式，屬性名稱可以是硬編碼的，也可以是變量或者函數(shù)返回值。/這樣是不行的MyObject.value+i/這樣就沒有問題MyObject"value"+i24.for in語句遍歷一個對象中的所有條目的時候，用for in語句是非常方便的。但有時候我們不需要遍歷對象中的方法，如果不需要的話，可以加上一條filter。/加上了一個過濾器的f

11、or in語句for(key in object)    if(object.hasOwnProperty(key)       .then do something.   25.代碼排版縮進(jìn) tab長度為4行長度 ，控制在可視范圍內(nèi)，以一個分號結(jié)束花括號,如果是一個代碼段，花括號緊跟在語句的后面文件功能定義base：網(wǎng)站常量common：我，自動延伸高，插入表情，統(tǒng)計字?jǐn)?shù)，全選，收藏心跳，分享站外，關(guān)注，彈窗，拖拽，top至頂page制作要求：、彈窗：按設(shè)計圖還原即可，不用考慮彈窗的位置。、對于網(wǎng)頁代碼

12、，一定要保持足夠的精簡，拷貝的無用代碼一定要刪除。、標(biāo)簽的語義化，不能濫用標(biāo)簽。、盡可能不用標(biāo)簽ID來控制樣式。后端：js功能性修改，需要通知前端。全局命名空間污染與 IIFE總是將代碼包裹成一個 IIFE(Immediately-Invoked Function Expression)，用以創(chuàng)建獨立隔絕的定義域。這一舉措可防止全局命名空間被污染。IIFE 還可確保你的代碼不會輕易被其它全局命名空間里的代碼所修改（i.e. 第三方庫，window 引用，被覆蓋的未定義的關(guān)鍵字等等）。不推薦1. var x = 10,2. y = 100;3.  4. / Declaring vari

13、ables in the global scope is resulting in global scope pollution. All variables declared like this5. / will be stored in the window object. This is very unclean and needs to be avoided.6. console.log(window.x + ' ' + window.y);推薦1. / We declare a IIFE and pass parameters into the function th

14、at we will use from the global space2. (function(log, w, undefined)3. 'use strict'4.  5. var x = 10,6. y = 100;7.  8. / Will output 'true true'9. log(w.x = undefined) + ' ' + (w.y = undefined);10.  11. (window.console.log, window);IIFE（立即執(zhí)行的函數(shù)表達(dá)式）無論何時，想要創(chuàng)建一個新的封

15、閉的定義域，那就用 IIFE。它不僅避免了干擾，也使得內(nèi)存在執(zhí)行完后立即釋放。所有腳本文件建議都從 IIFE 開始。立即執(zhí)行的函數(shù)表達(dá)式的執(zhí)行括號應(yīng)該寫在外包括號內(nèi)。雖然寫在內(nèi)還是寫在外都是有效的，但寫在內(nèi)使得整個表達(dá)式看起來更像一個整體，因此推薦這么做。不推薦1. (function()();推薦1. (function()();so，用下列寫法來格式化你的 IIFE 代碼：1. (function()2. 'use strict'3.  4. / Code goes here5.  6. ();如果你想引用全局變量或者是外層 IIFE 的變量，可以通過下

16、列方式傳參：1. (function($, w, d)2. 'use strict'3.  4. $(function() 5. w.alert(d.querySelectorAll('div').length);6. );7. (jQuery, window, document);嚴(yán)格模式ECMAScript 5 嚴(yán)格模式可在整個腳本或獨個方法內(nèi)被激活。它對應(yīng)不同的 javascript 語境會做更加嚴(yán)格的錯誤檢查。嚴(yán)格模式也確保了 javascript 代碼更加的健壯，運(yùn)行的也更加快速。嚴(yán)格模式會阻止使用在未來很可能被引入的預(yù)留關(guān)鍵字。你應(yīng)該在你的

17、腳本中啟用嚴(yán)格模式，最好是在獨立的 IIFE 中應(yīng)用它。避免在你的腳本第一行使用它而導(dǎo)致你的所有腳本都啟動了嚴(yán)格模式，這有可能會引發(fā)一些第三方類庫的問題。不推薦1. / Script starts here2. 'use strict'3.  4. (function()5.  6. / Your code starts here7.  8. ();推薦1. (function()2. 'use strict'3.  4. / Your code starts here5.  6. ();變量聲明總是使用

18、0;var 來聲明變量。如不指定 var，變量將被隱式地聲明為全局變量，這將對變量難以控制。如果沒有聲明，變量處于什么定義域就變得不清（可以是在 Document 或 Window 中，也可以很容易地進(jìn)入本地定義域）。所以，請總是使用 var 來聲明變量。采用嚴(yán)格模式帶來的好處是，當(dāng)你手誤輸入錯誤的變量名時，它可以通過報錯信息來幫助你定位錯誤出處。不推薦1. x = 10;2. y = 100;推薦1. var x = 10,2. y = 100;理解 JavaScript 的定義域和定義域提升在 JavaScript 中變量和方法定義會自動提升到執(zhí)行之前。JavaScript 只有

19、 function 級的定義域，而無其他很多編程語言中的塊定義域，所以使得你在某一 function 內(nèi)的某語句和循環(huán)體中定義了一個變量，此變量可作用于整個 function 內(nèi)，而不僅僅是在此語句或循環(huán)體中，因為它們的聲明被 JavaScript 自動提升了。我們通過例子來看清楚這到底是怎么一回事：原 function1. (function(log)2. 'use strict'3.  4. var a = 10;5.  6. for(var i = 0; i < a; i+) 7. var b = i * i;8. log(b);9. 10. &

20、#160;11. if(a = 10) 12. var f = function() 13. log(a);14. ;15. f();16. 17.  18. function x() 19. log('Mr. X!');20. 21. x();22.  23. (window.console.log);被 JS 提升過后1. (function(log)2. 'use strict'3. / All variables used in the closure will be hoisted to the top of the functio

21、n4. var a,5. i,6. b,7. f;8. / All functions in the closure will be hoisted to the top9. function x() 10. log('Mr. X!');11. 12.  13. a = 10;14.  15. for(i = 0; i < a; i+) 16. b = i * i;17. log(b);18. 19.  20. if(a = 10) 21. / Function assignments will only result in hoisted

22、variables but the function body will not be hoisted22. / Only by using a real function declaration the whole function will be hoisted with its body23. f = function() 24. log(a);25. ;26. f();27. 28.  29. x();30.  31. (window.console.log);根據(jù)以上提升過程，你是否可理解以下代碼？有效代碼1. (function(log)2. 'use

23、strict'3.  4. var a = 10;5.  6. i = 5;7.  8. x();9.  10. for(var i; i < a; i+) 11. log(b);12. var b = i * i;13. 14.  15. if(a = 10) 16. f = function() 17. log(a);18. ;19. f();20.  21. var f;22. 23.  24. function x() 25. log('Mr. X!');26. 27.  28

24、. (window.console.log);正如你所看到的這段令人充滿困惑與誤解的代碼導(dǎo)致了出人意料的結(jié)果。只有良好的聲明習(xí)慣，也就是下一章節(jié)我們要提到的聲明規(guī)則，才能盡可能的避免這類錯誤風(fēng)險。提升聲明為避免上一章節(jié)所述的變量和方法定義被自動提升造成誤解，把風(fēng)險降到最低，我們應(yīng)該手動地顯示地去聲明變量與方法。也就是說，所有的變量以及方法，應(yīng)當(dāng)定義在 function 內(nèi)的首行。只用一個 var 關(guān)鍵字聲明，多個變量用逗號隔開。不推薦1. (function(log)2. 'use strict'3.  4. var a = 10;5. var b

25、 = 10;6.  7. for(var i = 0; i < 10; i+) 8. var c = a * b * i;9. 10.  11. function f() 12.  13. 14.  15. var d = 100;16. var x = function() 17. return d * d;18. ;19. log(x();20.  21. (window.console.log);推薦1. (function(log)2. 'use strict'3.  4. var a = 10,5. b

26、 = 10,6. i,7. c,8. d,9. x;10.  11. function f() 12.  13. 14.  15. for(i = 0; i < 10; i+) 16. c = a * b * i;17. 18.  19.  20.  21. d = 100;22. x = function() 23. return d * d;24. ;25. log(x();26.  27. (window.console.log);把賦值盡量寫在變量申明中。不推薦1. var a,2. b,3. c;4.

27、60;5. a = 10;6. b = 10;7. c = 100;推薦1. var a = 10,2. b = 10,3. c = 100;總是使用帶類型判斷的比較判斷總是使用 = 精確的比較操作符，避免在判斷的過程中，由 JavaScript 的強(qiáng)制類型轉(zhuǎn)換所造成的困擾。如果你使用 = 操作符，那比較的雙方必須是同一類型為前提的條件下才會有效。如果你想了解更多關(guān)于強(qiáng)制類型轉(zhuǎn)換的信息，你可以讀一讀 Dmitry Soshnikov 的這篇文章。在只使用 = 的情況下，JavaScript 所帶來的強(qiáng)制類型轉(zhuǎn)換使得判斷結(jié)果跟

28、蹤變得復(fù)雜，下面的例子可以看出這樣的結(jié)果有多怪了：1. (function(log)2. 'use strict'3.  4. log('0' = 0); / true5. log('' = false); / true6. log('1' = true); / true7. log(null = undefined); / true8.  9. var x = 10. valueOf: function() 11. return 'X'12. 13. ;14.  15. log(x

29、= 'X');16.  17. (window.console.log);明智地使用真假判斷當(dāng)我們在一個 if 條件語句中使用變量或表達(dá)式時，會做真假判斷。if(a = true) 是不同于 if(a) 的。后者的判斷比較特殊，我們稱其為真假判斷。這種判斷會通過特殊的操作將其轉(zhuǎn)換為 true 或 false，下列表達(dá)式統(tǒng)統(tǒng)返回 false：false, 0, undefined, null, NaN, ''（空字符串）.這種真假判斷在我們只求結(jié)果而不關(guān)心過程的情況下，非常的

30、有幫助。以下示例展示了真假判斷是如何工作的：1. (function(log)2. 'use strict'3.  4. function logTruthyFalsy(expr) 5. if(expr) 6. log('truthy');18. else 19. log('falsy');20. 21. 22.  23. logTruthyFalsy(true); / truthy24. logTruthyFalsy(1); / truthy25. logTruthyFalsy(); / truthy26. logTruth

31、yFalsy(); / truthy27. logTruthyFalsy('0'); / truthy28.  29. logTruthyFalsy(false); / falsy30. logTruthyFalsy(0); / falsy31. logTruthyFalsy(undefined); / falsy32. logTruthyFalsy(null); / falsy33. logTruthyFalsy(NaN); / falsy34. logTruthyFalsy(''); / falsy35.  36. (window.con

32、sole.log);變量賦值時的邏輯操作邏輯操作符 | 和 && 也可被用來返回布爾值。如果操作對象為非布爾對象，那每個表達(dá)式將會被自左向右地做真假判斷?；诖瞬僮鳎罱K總有一個表達(dá)式被返回回來。這在變量賦值時，是可以用來簡化你的代碼的。不推薦7. if(!x) 8. if(!y) 9. x = 1;10. else 11. x = y;12. 13. 推薦1. x = x | y | 1;這一小技巧經(jīng)常用來給方法設(shè)定默認(rèn)的參數(shù)。1. (function(log)2. 'use strict'3.  4. fun

33、ction multiply(a, b) 5. a = a | 1;6. b = b | 1;7.  8. log('Result ' + a * b);9. 10.  11. multiply(); / Result 112. multiply(10); / Result 1013. multiply(3, NaN); / Result 314. multiply(9, 5); / Result 4515.  16. (window.console.log);分號總是使用分號，因為隱式的代碼嵌套會引發(fā)難以察覺的問題。當(dāng)然我們更要從根本上來杜絕這些

34、問題1。以下幾個示例展示了缺少分號的危害：1. / 1.2. MyCtotype.myMethod = function() 3. return 42;4. / No semicolon here.5.  6. (function() 7. / Some initialization code wrapped in a function to create a scope for locals.8. )();9.  10.  11. var x = 12. 'i': 1,13. 'j': 214. / No semi

35、colon here.15.  16. / 2. Trying to do one thing on Internet Explorer and another on Firefox.17. / I know you'd never write code like this, but throw me a bone.18. ffVersion, ieVersionisIE();19.  20.  21. var THINGS_TO_EAT = apples, oysters, sprayOnCheese / No semicolon here.22. &#

36、160;23. / 3. conditional execution a la bash24. -1 = resultOfOperation() | die();So what happens?1. JavaScript 錯誤 首先返回 42 的那個 function 被第二個 function 當(dāng)中參數(shù)傳入調(diào)用，接著數(shù)字 42 也被“調(diào)用”而導(dǎo)致出錯。2. 八成你會得到 no such property in undefined 的錯誤提示，因為在真實環(huán)境中的調(diào)用是這個樣子：xffVersion, ieVersionisIE().3. die 總是被調(diào)用。因為數(shù)組減 1 的結(jié)果是&

37、#160;NaN，它不等于任何東西（無論 resultOfOperation 是否返回 NaN）。所以最終的結(jié)果是 die() 執(zhí)行完所獲得值將賦給 THINGS_TO_EAT.Why?JavaScript 中語句要以分號結(jié)束，否則它將會繼續(xù)執(zhí)行下去，不管換不換行。以上的每一個示例中，函數(shù)聲明或?qū)ο蠡驍?shù)組，都變成了在一句語句體內(nèi)。要知道閉合圓括號并不代表語句結(jié)束，JavaScript 不會終結(jié)語句，除非它的下一個 token 是一個中綴符2 或者是圓括號操作符。這真是讓人大吃一驚，所以乖乖地給語句末加上分號吧。澄清：分號與函

38、數(shù)分號需要用在表達(dá)式的結(jié)尾，而并非函數(shù)聲明的結(jié)尾。區(qū)分它們最好的例子是：1. var foo = function() 2. return true;3. ; / semicolon here.4.  5. function foo() 6. return true;7. / no semicolon here.嵌套函數(shù)嵌套函數(shù)是非常有用的，比如用在持續(xù)創(chuàng)建和隱藏輔助函數(shù)的任務(wù)中。你可以非常自由隨意地使用它們。語句塊內(nèi)的函數(shù)聲明切勿在語句塊內(nèi)聲明函數(shù)，在 ECMAScript 5 的嚴(yán)格模式下，這是不合法的。函數(shù)聲明應(yīng)該在定義域的頂層。但在語句塊內(nèi)可將函數(shù)申明轉(zhuǎn)化為函數(shù)表達(dá)式賦值給變

39、量。不推薦1. if (x) 2. function foo() 3. 推薦1. if (x) 2. var foo = function() ;3. 異常基本上你無法避免出現(xiàn)異常，特別是在做大型開發(fā)時（使用應(yīng)用開發(fā)框架等等）。在沒有自定義異常的情況下，從有返回值的函數(shù)中返回錯誤信息一定非常的棘手，更別提多不優(yōu)雅了。不好的解決方案包括了傳第一個引用類型來接納錯誤信息，或總是返回一個對象列表，其中包含著可能的錯誤對象。以上方式基本上是比較簡陋的異常處理方式。適時可做自定義異常處理。在復(fù)雜的環(huán)境中，你可以考慮拋出對象而不僅僅是字符串（默認(rèn)的拋出值）。1. if(name = undefined)

40、2. throw 3. name: 'System Error',4. message: 'A name should always be specified!'5. 6. 標(biāo)準(zhǔn)特性總是優(yōu)先考慮使用標(biāo)準(zhǔn)特性。為了最大限度地保證擴(kuò)展性與兼容性，總是首選標(biāo)準(zhǔn)的特性，而不是非標(biāo)準(zhǔn)的特性（例如：首選 string.charAt(3) 而不是 string3；首選 DOM 的操作方法來獲得元素引用，而不是某一應(yīng)用特定的快捷方法）。簡易的原型繼承如果你想在 JavaScript 中繼承你的對象，請遵循一個簡易的模式來創(chuàng)建此繼承。如果你預(yù)計你會遇

41、上復(fù)雜對象的繼承，那可以考慮采用一個繼承庫，比如 Proto.js by Axel Rauschmayer.簡易繼承請用以下方式：1. (function(log)2. 'use strict'3.  4. / Constructor function5. function Apple(name) 6. = name;7. 8. / Defining a method of apple9. Atotype.eat = function() 10. log('Eating ' + );11.

42、 ;12.  13. / Constructor function14. function GrannySmithApple() 15. / Invoking parent constructor16. Atotype.constructor.call(this, 'Granny Smith');17. 18. / Set parent prototype while creating a copy with Object.create19. GrannySmithAtotype = Object.create(Atot

43、ype);20. / Set constructor to the sub type, otherwise points to Apple21. GrannySmithAtotype.constructor = GrannySmithApple;22.  23. / Calling a super method24. GrannySmithAtotype.eat = function() 25. / Be sure to apply it onto our current object with call(this)26. Atotyp

44、e.eat.call(this);27.  28. log('Poor Grany Smith');29. ;30.  31. / Instantiation32. var apple = new Apple('Test Apple');33. var grannyApple = new GrannySmithApple();34.  35. log(); / Test Apple36. log(grannyA); / Granny Smith37.  38. / Instance c

45、hecks39. log(apple instanceof Apple); / true40. log(apple instanceof GrannySmithApple); / false41.  42. log(grannyApple instanceof Apple); / true43. log(grannyApple instanceof GrannySmithApple); / true44.  45. / Calling method that calls super method46. grannyApple.eat(); / Eating Granny S

46、mithnPoor Grany Smith47.  48. (window.console.log);使用閉包閉包的創(chuàng)建也許是 JS 最有用也是最易被忽略的能力了。關(guān)于閉包如何工作的合理解釋。切勿在循環(huán)中創(chuàng)建函數(shù)在簡單的循環(huán)語句中加入函數(shù)是非常容易形成閉包而帶來隱患的。下面的例子就是一個典型的陷阱：不推薦1. (function(log, w)2. 'use strict'3.  4. / numbers and i is defined in the current function closure5. var numbers = 1, 2, 3,6. i

47、;7.  8. for(i = 0; i < numbers.length; i+) 9. w.setTimeout(function() 10. / At the moment when this gets executed the i variable, coming from the outer function scope11. / is set to 3 and the current program is alerting the message 3 times12. / 'Index 3 with number undefined13. / If you

48、understand closures in javascript you know how to deal with those cases14. / It's best to just avoid functions / new closures in loops as this prevents those issues15.  16. w.alert('Index ' + i + ' with number ' + numbersi);17. , 0);18. 19.  20. (window.console.log, win

49、dow);接下來的改進(jìn)雖然已經(jīng)解決了上述例子中的問題或 bug，但還是違反了不在循環(huán)中創(chuàng)建函數(shù)或閉包的原則。不推薦1. (function(log, w)2. 'use strict'3.  4. / numbers and i is defined in the current function closure5. var numbers = 1, 2, 3,6. i;7.  8. for(i = 0; i < numbers.length; i+) 9. / Creating a new closure scope with an IIFE sol

50、ves the problem10. / The delayed function will use index and number which are11. / in their own closure scope (one closure per loop iteration).12. / -13. / Still this is not recommended as we violate our rule to not14. / create functions within loops and we are creating two!15.  16. (function(i

51、ndex, number)17. w.setTimeout(function() 18. / Will output as expected 0 > 1, 1 > 2, 2 > 319. w.alert('Index ' + index + ' with number ' + number);20. , 0);21. (i, numbersi);22. 23.  24. (window.console.log, window);接下來的改進(jìn)已解決問題，而且也遵循了規(guī)范。可是，你會發(fā)現(xiàn)看上去似乎過于復(fù)雜繁冗了，應(yīng)該會有更好的解決方案吧。

52、不完全推薦1. (function(log, w)2. 'use strict'3.  4. / numbers and i is defined in the current function closure5. var numbers = 1, 2, 3,6. i;7.  8. / Create a function outside of the loop that will accept arguments to create a9. / function closure scope. This function will return a funct

53、ion that executes in this10. / closure parent scope.11. function alertIndexWithNumber(index, number) 12. return function() 13. w.alert('Index ' + index + ' with number ' + number);14. ;15. 16.  17. / First parameter is a function call that returns a function.18. / -19. / This so

54、lves our problem and we don't create a function inside our loop20. for(i = 0; i < numbers.length; i+) 21. w.setTimeout(alertIndexWithNumber(i, numbersi), 0);22. 23.  24. (window.console.log, window);將循環(huán)語句轉(zhuǎn)換為函數(shù)執(zhí)行的方式問題能得到立馬解決，每一次循環(huán)都會對應(yīng)地創(chuàng)建一次閉包。函數(shù)式的風(fēng)格更加值得推薦，而且看上去也更加地自然和可預(yù)料。推薦1. (function(log

55、, w)2. 'use strict'3.  4. / numbers and i is defined in the current function closure5. var numbers = 1, 2, 3,6. i;7.  8. numbers.forEach(function(number, index) 9. w.setTimeout(function() 10. w.alert('Index ' + index + ' with number ' + number);11. , 0);12. );13. &#

56、160;14. (window.console.log, window);eval 函數(shù)（魔鬼）eval() 不但混淆語境還很危險，總會有比這更好、更清晰、更安全的另一種方案來寫你的代碼，因此盡量不要使用 evil 函數(shù)。this 關(guān)鍵字只在對象構(gòu)造器、方法和在設(shè)定的閉包中使用 this 關(guān)鍵字。this 的語義在此有些誤導(dǎo)。它時而指向全局對象（大多數(shù)時），時而指向調(diào)用者的定義域（在 eval 中），時而指向 DOM 樹中的某一節(jié)點（當(dāng)用事件處理綁定到 HTML 屬性上時），時而指向一個新創(chuàng)建的對象（在構(gòu)造器中），還時而指向其它的一些對象（如果函數(shù)被 call() 和 apply() 執(zhí)行和調(diào)用時）。正因為它是如此容易地被搞錯，請限制它的使用場景：1. 在構(gòu)造函數(shù)中2. 在對象的方法中（包括由此創(chuàng)建出的閉包內(nèi)）首選函數(shù)式風(fēng)格函數(shù)式編程讓你可以簡化代碼并縮減維護(hù)成本，因為它容易復(fù)用，又適當(dāng)?shù)亟怦詈透俚囊蕾?。接下來的例子中，在一組數(shù)字求和的同一問題上，比較了兩種解決方案。第一