Web前端新手都應該瞭解的JavaScript 開發技巧

對於初學web前端的人而言,JavaScript都是他們學習中不可繞開知識點,Javascript 的不少擴展的特性是的它變得更加的犀利, 同時也給予程序員機會建立更漂亮而且更讓用戶喜歡的網站。對於從事web前端工做的小夥伴們來講JavaScript是必備技能,爲了你們提升工做技能,小編爲你們準備了這篇JavaScript 開發技巧,咱們一塊兒來看一看吧!
圖片描述javascript

一、在使用 javascript 類庫以前先學習 javascript前端

互聯網充斥着不少的 javascript 類庫,不少程序員都每每使用 js 類庫而不理解負面影響。強烈建議你在使用第三方類庫以前學習基本的 JS 代碼,不然,你就準備着倒黴吧。java

二、思考後再修改 prototypes程序員

添加新的屬性到對象 prototype 中是致使腳本出錯的常見緣由。web

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 () { … };

在這裏小編建了一個前端學習交流扣扣羣:132667127,我本身整理的最新的前端資料和高級開發教程,若是有想須要的,能夠加羣一塊兒學習交流

三、Debug Javascript 代碼

即便最好的開發人員都會犯錯。爲了最大化的減小相似錯誤,請在你的 debugger 中運行你的代碼,確認你沒有遇到任何細微的錯誤。

四、避免 Eval

你的 JS 在沒有 eval 方法的時候也能夠很好的工做。eval 容許訪問 javascript 編譯器。若是一個字符串做爲參數傳遞到 eval,那麼它的結果能夠被執行。

這會很大的下降代碼的性能。儘可能避免在產品環境中使用 eval。

五、 最小化 DOM 訪問

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

六、儘量的保持代碼簡潔

可能你們都聽到過了N遍這個代碼簡潔問題了。做爲一個開發人員你可能在你的代碼開發過程當中使用了不少次,但千萬不要在 js 開發中忘記這點。

§ 儘可能在開發模式中添加註釋和空格,這樣保持代碼的可讀性

§ 在發佈到產品環境前請將空格和註釋都刪除,而且儘可能縮寫變量和方法名

使用第三方工具幫助你實現壓縮 javascript。

七、不要用 「SetTimeOut」 和 「Setinterval」 方法來做爲 「Eval」 的備選

setTimeOut( "document.getID('value')", 3000);

在以上代碼中 document.getID(‘value’) 在 setTimeOut 方法中被做爲字符串來處理。 這相似於 eval 方法,在每一個代碼執行中來執行一個字符串,所以會下降性能,所以,建議在這些方法中傳遞一個方法。

setTimeOut(yourFunction, 3000);

八、[] 比 new Array(); 更好

一個常犯的錯誤在於使用當須要數組的時候使用一個對象或者該使用對象的時候使用一個數組。可是使用原則很簡單:

「當屬性名稱是小的連續整數,你應該使用數組。不然,使用一個對象」 – Douglas Crockford, JavaScript: Good Parts 的做者.

建議:

var a = ['1A','2B'];

避免:

var a = new Array();

a[0] = "1A";

a[1] = "2B";

九、儘可能不要屢次使用 var

在初始每個變量的時候,程序員都習慣使用 var 關鍵字。相反,建議你使用逗號來避免多餘的關鍵字,而且減小代碼體積。 以下:

var variableOne = 'string 1',

variableTwo = 'string 2',

variableThree = 'string 3';

十、不要忽略分號 「;」

這每每是你們花費數個小時進行 debug 的緣由之一。

我很確信你確定也在其它的文章中閱讀過以上相關的內容,可是你們可能每每都忽略了不少基本的規則。 你是否是也曾經忽略過度號。是否是也遇到過 eval 關鍵字問題致使性能問題?

以上就是小編今天爲你們分享的關於Web前端新手都應該瞭解的JavaScript 開發技巧的文章。

相關文章
相關標籤/搜索