Vị trí của dấu ngoặc đơn để tự động thực thi các hàm JavaScript ẩn danh?

Gần đây tôi đã so sánh phiên bản hiện tại của json2.js với phiên bản mà tôi có trong dự án của mình và nhận thấy sự khác biệt về cách biểu thức hàm được tạo và tự thực thi.

Mã được sử dụng để bọc một hàm ẩn danh trong ngoặc đơn và sau đó thực thi nó,

(function () {
  // code here
})();

nhưng bây giờ nó bao bọc hàm tự động thực thi trong ngoặc đơn.

(function () {
  // code here
}());

Có một nhận xét của CMS trong câu trả lời được chấp nhận của Giải thích cú pháp hàm ẩn danh được đóng gói của JavaScript rằng "cả hai: (function(){})();và (function(){}());đều hợp lệ."

Tôi đã tự hỏi sự khác biệt là gì? Cái trước có chiếm bộ nhớ bằng cách để lại một chức năng ẩn danh toàn cầu không? Dấu ngoặc phải được đặt ở đâu?

Chúng hầu như giống nhau.

Đầu tiên bao quanh dấu ngoặc đơn xung quanh một hàm để biến nó thành một biểu thức hợp lệ và gọi nó. Kết quả của biểu thức là không xác định.

Hàm thứ hai thực thi hàm và các dấu ngoặc đơn xung quanh lệnh gọi tự động làm cho nó trở thành một biểu thức hợp lệ. Nó cũng đánh giá là không xác định.

Tôi không nghĩ rằng có một cách "đúng" để làm điều đó, vì kết quả của biểu thức là như nhau.

> function(){}()
SyntaxError: Unexpected token (
> (function(){})()
undefined
> (function(){return 'foo'})()
"foo"
> (function(){ return 'foo'}())
"foo"

Trong trường hợp đó, nó không quan trọng. Bạn đang gọi một biểu thức phân giải thành một hàm trong định nghĩa đầu tiên, đồng thời xác định và gọi ngay một hàm trong ví dụ thứ hai. Chúng giống nhau vì biểu thức hàm trong ví dụ đầu tiên chỉ là định nghĩa hàm.

Có những trường hợp khác rõ ràng hữu ích hơn để gọi các biểu thức giải quyết các hàm:

(foo || bar)()

Không có bất kỳ sự khác biệt nào ngoài cú pháp.

Về mối quan tâm của bạn về phương pháp thực hiện thứ hai:

Xem xét:

(function namedfunc () { ... }())

namedfuncsẽ vẫn không ở phạm vi toàn cầu mặc dù bạn đã cung cấp tên. Tương tự với các chức năng ẩn danh. Cách duy nhất để có được nó trong phạm vi đó là gán nó cho một biến bên trong parens.

((namedfunc = function namedfunc () { ... })())

Các parens bên ngoài là không cần thiết:

(namedfunc = function namedfunc () { ... })()

Nhưng bạn không muốn tuyên bố toàn cầu đó, phải không?

Vì vậy, nó tổng hợp thành:

(function namedfunc () { ... })()

Và bạn có thể giảm nó hơn nữa: tên là không cần thiết vì nó sẽ không bao giờ được sử dụng (trừ khi hàm của bạn là đệ quy .. và thậm chí sau đó bạn có thể sử dụng arguments.callee)

(function () { ... })()

Đó là cách tôi nghĩ về nó (có thể không chính xác, tôi chưa đọc thông số kỹ thuật của ECMAScript). Hy vọng nó giúp.

Sự khác biệt chỉ tồn tại bởi vì Douglas Crockford không thích kiểu đầu tiên cho IIFEs ! (seriuosly) Như bạn có thể thấy trong video này !! .

Lý do duy nhất cho sự tồn tại của gói phụ () {trong cả hai kiểu} là để giúp tạo phần mã đó Biểu thức hàm , vì Khai báo hàm không thể được gọi ngay lập tức. Một số kịch bản / Rút gọn-ERS chỉ sử dụng +, !, -& ~thay vì quá ngoặc đơn. Như thế này:

+function() {  
    var foo = 'bar';  
}();

!function() {  
    var foo = 'bar';  
}();

-function() {  
    var foo = 'bar';  
}();

~function() {  
    var foo = 'bar';  
}();

Và tất cả những điều này hoàn toàn giống với các lựa chọn thay thế của bạn. Lựa chọn trong số các trường hợp này là hoàn toàn của riêng bạn và không có sự khác biệt. {Những người với ()sản phẩm 1 Byte tập tin lớn hơn ;-)}