作者grence (dalalida)
看板Ajax
標題Re: [問題] 如何管理大量事件綁定、錯誤處理
時間Mon Aug 26 01:22:50 2013
※ 引述《tomin (弱水三千 只取一瓢飲)》之銘言：
: ※ 引述《grence (dalalida)》之銘言：
: : 拆成獨立的 js檔（眼不見為淨XD
: : 再看是用前端處理：
: : window.onload=function(){
: : getScript("add.js");
: : getScript("delete.js");
: : }
: : 或是配合後端：
: : <script src="combine?file=add.js,delete.js"></script>
: : 這做法的前提是各 function彼此獨立，不然考慮到載入、執行順序又會很囉嗦。
: : 不過我覺得原本的程式看起來不會很難維護…可能是 PO文的時候有簡化過？
: : 如果是懂 js但對原程式架構不熟的人，看到這種可以直接翻譯的程式碼反而比較單純；
: : 畫面上看到 .delete_button_1，
: : 要知道它做了什麼事就直接在程式碼搜尋 ".delete_button_1"
: 拆檔看起來很乾淨 只是還是放同一個檔方便:
: 1.維護的人只要搜一個檔即可找到所有資訊
: 2.變數、function似乎要同個檔才能互相引用
所以我覺得你的狀況可能用不著拆檔案，
我用過的一個例子是把功能跟 dom操作分開：
====
var namespace = {
add: function(){},
update: function(){},
delete: function(){},
....
}
====
$(function(){
$(".addButton").click(namespace.add);
...
});
====
: 原本程式有簡化過 不然code太長也不好閱讀
: 我有漏講一個問題 我試著將一些function歸類:
: function initForm() {
: function addButton() {}
: function deleteButton() {}
: }
: 這樣寫視覺上是有分類的
我覺得不只視覺上有分類，把變數有效範圍縮小，對閱讀也有幫助；
但這點也可以透過團隊規範(convention)達成。
: 但其實沒必要這樣包裝 本來只有這樣寫
: function addButton() {}
: function deleteButton() {}
: 只是這樣的function一多 就會覺得有點亂 想要將fn分群組
: 還是我fn命名上動手腳就好了? 例如都有個prefix
好像又跟 convention扯上關係…但是通常公司、團隊都沒有XD
沒有的話，就讓自己三個月後還能看懂就好。
: formAddButton
: formDeleteButton
: 然後把同一類的擺近一點 似乎就夠一目了然了
: : 我自己寫 js很少用 try catch，即使沒出錯，瀏覽器的效能也會有影響，
: : 有時候還會遇到奇怪的 bug
: : 而且 js檢查變數是否有值或是給預設值都很簡單，
: : function test(param, option){
: : param = param || {};
: : option && option.handler && option.handler();
: : };
: 其實錯誤也只有拿不到node的問題 因為有時候DOM結構不如預期
: 拿不到node 只會拿到null/undefined 那我要嘛幫他初始化
: 要嘛檢查拿到的東西是不是null，再往下跑?
我遇到的通常 null就不做事了，偶爾要 append node才有初始化…
呃，這不就我一開始回文舉的兩個可能狀況XD
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 180.176.94.242
1F：→ dlikeayu:JQ直接寫.click現在有直接bind的了嗎？？？ 08/26 09:26
2F：→ dlikeayu:記得不是要.on("click", function(){}) 08/26 09:26
3F：→ kerash:.click 不是很早就有了嗎@@? 08/26 12:28
4F：→ akiratw:.click(function(){}) = .on('click', function(){}) 08/26 12:53
5F：推 tomin:Namespace很讚 我來試試 謝謝 08/26 22:44
6F：→ dlikeayu:之前我怎麼記得用click直接做的話，developer的瀏覽器不 08/27 11:20
7F：→ dlikeayu:能用來監聽debug 08/27 11:21
8F：→ dlikeayu:當然能有click的效果是沒錯 08/27 11:21
9F：→ dlikeayu:我想起來了，該篇是在說onClick的問題 不是click() 08/27 11:41
10F：→ dlikeayu:一時記錯 抱歉= = 08/27 11:41