在 JavaScript 函數開始或結束時防止默認事件動作的優缺點

Question

在以下 JavaScript 代碼示例中：

var myButton = $('#myButton');
myButton.click(function (event) {
    /* stuff... */
    event.preventDefault();
});

default-preventing action 在函數的開頭或結尾有什么好處和壞處？ - 假設最終無條件地想要阻止它。 有任何技術理由選擇一種方式嗎？

上網沖浪我發現只有一個參考- 死博客，抱歉谷歌緩存鏈接 - 並指出在開始時阻止默認操作將避免在 js 函數崩潰的情況下發生該操作。

注意：我在示例中使用 jQuery 只是為了熟悉，問題與 jQuery 無關，經典事件處理模式的答案將是相同的。

Answer 1

出於你所說的原因，我把我的預防代碼放在了開頭。 如果在函數前面的 js 前面有錯誤，那么默認的動作就已經被阻止了。 這可能是生產中所需的行為，但也有助於調試您的開發代碼，請考慮：

$('a').on('click', function(e) {
  console.log('some debugging information here');
  // Other stuff
  e.preventDefault();
});

如果發生錯誤，頁面可能會在您閱讀調試信息之前刷新或跟隨錨點的 href。 將操作切換到頂部將確保您可以在控制台中讀取輸出。

編輯正如 Axel 在評論中指出的那樣，另一個優點是您立即意識到代碼正在替換默認操作而不是補充它。

Answer 2

最終調用preventDefault()的位置完全取決於開發人員的選擇。 盡管在大多數情況下已經指出，更好的選擇是將它放在代碼的最頂部以避免像這樣的不可預測的行為：

 $('#one').click(function(ev){
  //ev.preventDefault(); // for 90% this is better choice, consider example below
  alert('no hey!');
  return; // this is very simple example, in more complex code sometimes it could not be such obvious
  ev.preventDefault(); // sometimes though it may be required to keep default action depending on some cases
})

但是必須承認，您可能會根據某些情況保留默認操作，因為我的觀點是這種情況很少見，但是您可以將防止默認設置在底部並在某些 if 條件下使用 return。

Answer 3

您沒有任何區別，消息隊列被困在您的函數中。