DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript基礎知識 >> 你需要知道的10個最佳javascript開發實踐小結
你需要知道的10個最佳javascript開發實踐小結
編輯:JavaScript基礎知識     
盡管很多的開發人員都樂於頌揚javascript,但是仍舊有人看到它的陰暗面。

使用很多javascript代碼的web頁面會加載很慢,過多的使用javascript使得網頁丑陋和拖沓。很快如何有效地使用javascript成為一個非常火熱的話題。

這裡讓我們列出10個最佳javascript實踐,幫助你有效地使用javascript。

1. 盡可能的保持代碼簡潔
可能大家都聽到過了N遍這個代碼簡潔問題了。作為一個開發人員你可能在你的代碼開發過程中使用了很多次,但千萬不要在js開發中忘記這點。

盡量在開發模式中添加注釋和空格,這樣保持代碼的可讀性
在發布到產品環境前請將空格和注釋都刪除,並且盡量縮寫變量和方法名
使用第三方工具幫助你實現壓縮javascript。
2. 思考後再修改prototypes
添加新的屬性到對象prototype中是導致腳本出錯的常見原因。
復制代碼 代碼如下:
yourObject.prototype.anotherFunction = ‘Hello';
yourObject.prototype.anotherMethod = function () { … };

在上面代碼中,所有的變量都會被影響,因為他們都繼承於"yourObject"。這樣的使用會導致意想不到的行為。所以建議在使用完後刪除類似的修改。
復制代碼 代碼如下:
yourObject.prototype.anotherFunction = ‘Hello';
yourObject.prototype.anotherMethod = function () { … };
test.anotherMethod();
delete yourObject.prototype.anotherFunction = ‘Hello';
delete yourObject.prototype.anotherMethod = function () { … };

3. Debug Javascript代碼
即使最好的開發人員都會犯錯。為了最大化的減少類似錯誤,請在你的debugger中運行你的代碼,確認你沒有遇到任何細微的錯誤

4. 避免Eval
你的JS在沒有"eval"方法的時候也可以很好的工作。“eval”允許訪問javascript編譯器。如果一個字符串作為參數傳遞到"eval",那麼它的結果可以被執行。

這會很大的降低代碼的性能。盡量避免在產品環境中使用"eval"。

5. 最小化DOM訪問
DOM是最復雜的API,會使得代碼執行過程變慢。有時候web頁面可能沒有加載或者加載不完整。最好避免DOM。

6. 在使用javascript類庫之前先學習javascript
互聯網充斥著很多的javascript類庫,很多程序員都往往使用js類庫而不理解負面影響。強烈建議你在使用第三方類庫之前學習基本的JS代碼,否則,你就准備著倒霉吧。

7. 不要用"SetTimeOut"和"Setinterval"方法來作為"Eval"的備選
setTimeOut( "document.getID('value')", 3000);
在以上代碼中 document.getID('value') 在"setTimeOut"方法中被作為字符串來處理。這類似於'eval'方法,在每個代碼執行中來執行一個字符串,因此會降低性能,因此,建議在這些方法中傳遞一個方法。

setTimeOut(yourFunction, 3000);
8. []比"new Array();"更好
一個常犯的錯誤在於使用當需要數組的時候使用一個對象或者該使用對象的時候使用一個數組。但是使用原則很簡單:

“當屬性名稱是小的連續整數,你應該使用數組。否則,使用一個對象” - Douglas Crockford, JavaScript: Good Parts的作者.

建議:
var a = ['1A','2B'];
避免:

var a = new Array();
a[0] = "1A";
a[1] = "2B";
9. 盡量不要多次使用var
在初始每一個變量的時候,程序員都習慣使用"var"關鍵字。相反,建議你使用逗號來避免多余的關鍵字,並且減少代碼體積。 如下:

var variableOne = ‘string 1',
variableTwo = ‘string 2',
variableThree = ‘string 3';
10. 不要忽略分號 ";"
這往往是大家花費數個小時進行debug的原因之一。

我很確信你肯定也在其它的文章中閱讀過以上相關的內容,但是大家可能往往都忽略了很多基本的規則。你是不是也曾經忽略過分號。是不是也遇到過eval關鍵字問題導致性能問題?希望大家能夠喜歡,謝謝!
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved