Re: [問題] 如何管理大量事件綁定、錯誤處理

[grence (dalalida)]

※ 引述《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
→ dlikeayu:JQ直接寫.click現在有直接bind的了嗎？？？
→ dlikeayu:記得不是要.on("click", function(){})
→ kerash:.click 不是很早就有了嗎@@?
→ akiratw:.click(function(){}) = .on('click', function(){})
推 tomin:Namespace很讚 我來試試 謝謝
→ dlikeayu:之前我怎麼記得用click直接做的話，developer的瀏覽器不
→ dlikeayu:能用來監聽debug
→ dlikeayu:當然能有click的效果是沒錯
→ dlikeayu:我想起來了，該篇是在說onClick的問題 不是click()
→ dlikeayu:一時記錯 抱歉= =