Sự khác nhau giữa hai mã javascript là gì?

Question

Trong một số mã Javascript trong đó sử dụng chức năng ngay lập tức, nó có lý lẽ window hay document như sau:

(function (window, document) { 
    ... 
})(window, document); 

Tuy nhiên, window và document là những đối tượng toàn cầu và có thể được truy cập trực tiếp như sau:

(function() { 
    var userAgent = window.navigator.userAgent; 
    ... 
    var el = document.getElementById(...) 
    ... 
})(); 

Sự khác biệt giữa hai mã trên là gì. Đó là cách tốt hơn và tại sao?

Answer 1

Có hai lý do tôi có thể nghĩ:

1) các biến địa phương là người đầu tiên trong chuỗi phạm vi, vì vậy khả năng tiếp cận nhanh hơn globals (với nhanh Ý tôi là không đáng kể nhanh hơn).

2) Bên trong chức năng, window và document là các biến địa phương, vì vậy tên của họ có thể được minimified:

(function (w, d) { 
//var userAgent = w.navigator.userAgent; 

)(window, document); 

Answer 2

Sự khác biệt là đa hình: trong trường hợp đầu tiên, bạn có thể vượt qua chức năng bất kỳ cặp của các đối tượng hoạt động như các đối tượng window và document (ít nhất là đối với các phương thức mà hàm của bạn gọi) và chức năng cũng sẽ hoạt động với chúng.

Trên thực tế, với điều này hai đối tượng đặc biệt, đó là lỗi nhiều dễ bị mà bất kỳ lợi ích - mọi người đều hy vọng window và document là cácwindow và document xác định bởi Javascript. Nhưng về lý thuyết, đó là lợi ích.

Answer 3

Sự khác biệt giữa hai mã ở trên là gì. Đó là cách tốt hơn và tại sao?

Trong tất cả tính thực tiễn và cách sử dụng trong trình duyệt, không có sự khác biệt đáng kể.

Điều đó nói rằng, có một sự gia tăng hiệu suất rất nhỏ đến từ việc tham chiếu các biến cục bộ thay vì các hình cầu.

Ngoài ra, nó cho phép sự linh hoạt của việc hoán đổi một phiên bản giả thực sự window; điều này có thể hữu ích trong quá trình thử nghiệm và trong một số môi trường nhất định, nơi một số đối tượng không có sẵn và phải được thay thế.

Btw, có một loại đối số khác mà bạn có thể vượt qua, là undefined; nó giống như thế này:

(function(undefined) { 
    // your code 
}()); 

Bạn không thực sự chuyển bất kỳ thứ gì đến hàm bên ngoài và làm như vậy bạn đảm bảo rằng undefined không bị giả mạo; những người pedantic như bản thân mình sẽ chỉ void 0 cho mục đích đó :)