如何使javascript代碼易於維護

所有，我正在研究一個高度交互式的web應用程序，它需要大量的jquery或js代碼，而且我發現我的代碼變得有點難以維護，並不全是可讀的。有時甚至作者也找不到指定的代碼。如何使javascript代碼易於維護

到目前爲止，我爲清晰代碼所做的工作如下。在一個JS文件

一個JS組件。（例如，CustomTab.js是在我的應用程序一個凸片部件。）
使用templete以基於JSON部件HTML。
使用JQuery UI。
Unobtrusive JavaScript。

有沒有其他要點需要注意的地方？無論如何，任何建議或建議使js庫/框架容易miantanance的技巧是appeciated，謝謝。

來源

2013-02-27 Joe.wang

好的問題。我會留下來看看這篇文章得到了什麼回覆！ ;-) – 2013-02-27 05:51:47

你也可以試試'jquery cdn'，這樣你可以從你的javascript文件夾中刪除jquery文件 – Prateek 2013-02-27 05:51:58

爲什麼你說你的代碼變得難以維護？你遇到了什麼具體問題？具體來說，爲什麼作者找不到代碼？有沒有更多的細節可以幫助我們？ – MattDiamant 2013-02-27 05:54:23

我可以建議你使用模塊模式和RequireJS一起組織你的JavaScript代碼。對於生產，您將能夠使用RequireJS優化器將您的模塊構建到一個JavaScript文件中。

此外，如果你期望你的客戶端應用程序將是巨大的，考慮使用一些JavaScript MVC框架，如Backbone.js和服務器端RESTful服務。

來源

2013-02-27 05:57:46

嗨，Evgeniy，我喜歡你的想法。你能告訴我更多關於js mvc嗎？它有什麼好處？謝謝。 – 2013-02-27 06:10:16

最主要的好處是瀏覽器關心視圖渲染和用戶的操作處理，所以你將服務器卸載了很多，交互通常通過AJAX進行，並且它改善了用戶體驗。我目前的項目中有86％的JavaScript代碼和12％的Python代碼（RESTful服務），因此您可以想象在客戶端使用了多少處理器時間以及服務器上有多少處理器時間。 – 2013-02-27 06:46:48

我可以將jQuery UI與它結合起來嗎？因爲我認爲jQuery UI很擅長UI展示。謝謝 – 2013-02-27 07:07:33

我用我的圖書館這個命名空間模式：

MyLibrary.ListView.js：

var MyLibrary = MyLibrary || {}; 

MyLibrary.ListView = { 

    doSomethingOnListView: function() { 
     ... 
     return this; 
    }, 

    doSpecialThing: function() { 
     ... 
     return this; 
    }, 

    init: function() { 

     // Additional methods to run for all pages 
     this.doSomethingOnListView(); 

     return this; 
    } 
};

無論頁面需要這樣的：

<script type="text/javascript" src="/js/MyLibrary.ListView.js"></script> 
<script type="text/javascript"> 
$(function() { 
    MyLibrary.ListView 
     .init() 
     .doSpecialThing(); 
}); 
</script>

你甚至可以鏈方法，如果一定頁面需要額外的功能。

來源

2013-02-27 06:03:29

目前我還在爲我的公司開發JS框架。我在做的是我使用面向JS的OOP元素。換句話說，我正在實現類似於C＃庫的代碼（並非如此，模擬將是正確的詞）。作爲C＃中的示例，您使用Microsoft.Window.Forms，因此我可以使用JSOOP並使用方法擴展和重寫來創建相同的場景。但是如果你在你的項目中走得太遠，把你的JS代碼轉換成JSOOP將會很耗時。

使用JSLint，這將驗證您的代碼，並使其成爲可讀的腳本引擎友好代碼。儘管JSLint非常嚴格，您也可以使用JSHint。

對每個組件使用單獨文件是一個好主意，我也在做。

如果你喜歡，你可以下載jQuery開發者版本，你可以有一個大概的想法他們如何創建框架。我學習了很多關於jQuery框架的東西！

來源

2013-02-27 06:09:09 Ryxle

這和我每次問自己的問題完全一樣。我認爲有幾種方法可以輕鬆維護代碼。

在JavaScript開源項目中貢獻並瞭解他們如何解決這個問題。我認爲你可以從每個項目中收集一些獨特的解決方案，項目結構的公共部分將回答你關於維護的問題。
使用準備好的解決方案，如backbone，knockout，ember或angularjs如果我沒有記錯的角度不給你的結構，但對於用更少的代碼創建頁面爲您提供強大的工具。同時檢查todomvc的現成解決方案。
閱讀書籍並嘗試爲您的需求創建一些結構。這將是困難和漫長的，但結果（也許幾年後:)）將是真棒。

來源

2013-02-27 06:35:56

嗨，魯本，他們都是好方法，但我更喜歡第二個。試試js mvc框架，謝謝。 – 2013-02-27 07:14:02

如何使javascript代碼易於維護

回答

相關問題