Sử dụng đúng jquery $ (tài liệu) .ready() khi khai báo các hàm được gọi sẵn sàng()

Question

Tôi đã bắt đầu thói quen bắt đầu mã hóa jquery với hàm sẵn sàng $(function(){...}); và đặt tất cả các hàm gọi từ sẵn sàng trong sẵn sàng.

Sau đó, tôi nhận ra rằng một số chức năng được đưa vào chức năng sẵn sàng có thể không cần phải ở đó.

Ví dụ, chức năng đơn giản được sử dụng bởi các sự kiện trong tài liệu sẵn sàng có thể được khai báo bên ngoài của nó:

function checkEmail(objelement){ 
    var emailRx = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/; 
    return emailRx.test(objelement.val()) ? true : false; 
} 

Sau đó, sử dụng bên trong của nó:

//code snippet for example 

$(function(){ 

$("form[name='contactform']").submit(function(){ 
    $("input[type=text]").each(function(){ 
     if($(this).attr("id") == "email" && !checkEmail($(this))) { 
      $(this).prev().css("color","red"); 
     } 
    }); 
}); 

}); 

Tôi đã tìm kiếm thông qua nhiều câu hỏi SO trước và dường như không thể tìm ra câu trả lời.

Tốt hơn, tệ hơn hoặc không khác nhau để khai báo các hàm bên ngoài sẵn sàng theo cách này? Các hàm

Answer 1

Nếu bạn khai báo chúng ở bên ngoài, tất cả điều đó có nghĩa là chúng tồn tại trong phạm vi toàn cầu.

Lợi thế của việc này là chúng có thể được sử dụng lại bên ngoài hàm document.ready. Một bất lợi là chúng lộn xộn lên không gian tên chung (điều này có thể tránh được bằng cách đặt tên, nếu bạn muốn).

Cá nhân, nếu tôi định sử dụng lại chúng, chúng sẽ ra ngoài. Nếu họ cần tham chiếu một biến hoặc cái gì đó khác sẽ chỉ tồn tại trong phạm vi xử lý domready của tôi, chúng đi vào bên trong (thường là các hàm ẩn danh). Gần đây, tôi đã đặt mọi thứ tôi có thể ra bên ngoài bộ xử lý domready đơn giản vì trình thông dịch phải phân tích cú pháp tất cả các khai báo hàm trong bộ xử lý domready trước khi bắt đầu thực thi trình xử lý và trì hoãn việc xử lý các loại bộ xử lý domready của bạn. mục đích (bất kể thời gian đó là không đáng kể).

Answer 2

luôn được khai báo bên ngoài sự kiện sẵn sàng hoặc bất kỳ sự kiện tải nào. Nhưng bạn nên đảm bảo rằng các hàm được khai báo trước khi bạn sử dụng chúng để tránh bất kỳ lỗi nào trong việc thực thi mã.

Answer 3

Tốt hơn

Mã của bạn sẽ dễ đọc hơn.

Hãy nhớ $(document).ready() cũng chỉ là một chức năng.

Bất kỳ thứ gì có thể được đóng gói và đưa vào chức năng có thể sử dụng lại chức năng sẽ được gọi.

Hãy suy nghĩ theo cách này ... bạn sẽ làm tương tự nếu bạn đang xử lý sự kiện nhấp của nút?