hàm javascript so với (hàm() {...}());

Question

Tôi thường thấy các biểu thức như:

(function() { 
    var x = 1; 
    ... 
}()); 

Làm cách nào để diễn giải? về mặt cú pháp, điều này một mình là định nghĩa hàm ẩn danh.

function() { 
... 
} 

what the() sau đó? và tại sao đặt nó trong dấu()?

Cảm ơn

Answer 1

Chính xác như cũ, ngoại trừ việc nó được gọi ngay sau khi được chuyển đổi thành biểu thức hàm.

// v-----first set of parentheses makes the function an expression 
    (function() { 
     var x = 1; 
     ... 
    }()); 
// ^-----this set is used to invoke the function 

Tương tự như nếu bạn đã làm:

var myfunc = function() { 
     var x = 1; 
     ... 
    }; 
    myfunc(); 

hoặc (tương tự) này:

var returnValue = function() { 
     var x = 1; 
     ... 
    }(); 

Loại bỏ những cái tên, di chuyển ngoặc xung quanh, và bạn có thể thấy họ' không phải là khác nhau.

Answer 2

Khu vực mà tôi thường thấy hữu ích nhất là ở các chức năng gọi lại. Ký hiệu này cũng có thể được sử dụng trong trường hợp bạn cần đưa biến vào hàm gọi lại, nhưng bạn cần trạng thái biến không bị ảnh hưởng bởi những gì diễn ra bên ngoài hàm.

var someVal = 1; 

setTimeout((function(one) { 
     return function() { 
      alert(one); // alerts a 1 even 10 seconds after someVal++; 
     } 
})(someVal), 10000); 

someVal++; // the value in the setTimeout will remain the same as it is locked inside. 

Trong ngữ cảnh này, setTimeout có chức năng không có đối số. Vì vậy, câu hỏi về cách chuyển một giá trị cho hàm đó được trả lời bằng cách tạo ra một hàm nhận một đối số trả về một hàm lấy 0 đối số.

Tôi đề nghị bất cứ ai muốn tìm hiểu thêm về sức mạnh của ký hiệu này để chơi cùng với nó trong bảng điều khiển Firebug JavaScript. Một khi bạn quấn đầu xung quanh khái niệm này, bạn sẽ bắt đầu thấy các khu vực mà khái niệm mạnh mẽ này có thể được sử dụng.