Dấu ngoặc nhọn trống bên trong jQuery

Question

Trong đoạn mã, $({}).queue(function(next){}) $({}) đại diện cho những gì? Tại sao mọi người sử dụng biểu mẫu này?

Tôi nhận mã từ this answer here on SO.

Answer 1

Cập nhật trả lời

bạn comment below mà bạn đang đề cập đến các mã trong this answer thay đổi điều rõ rệt.

Mã trong câu trả lời rằng:

$(document) 
    .queue(callMe1) 
    .queue(callMe2); 

... và sau đó có một bình luận gợi ý sử dụng {} thay vì document:

$({}) 
    .queue(callMe1) 
    .queue(callMe2); 

Bạn sẽ làm gì đó để thiết lập một chuỗi các cuộc gọi , nơi mà các cuộc gọi tiếp theo trong chuỗi không xảy ra cho đến khi các cuộc gọi trước đó kết thúc. Những gì họ làm có thể đồng bộ hoặc không đồng bộ. Đó là một dạng lời hứa sớm.

Hãy lấy một ví dụ: Giả sử tôi muốn làm ba việc, cái khác, và mỗi thứ trong số đó có thể hoặc không thể làm điều gì đó không đồng bộ, giống như hoạt ảnh. Chúng tôi có thể làm điều này:

$({}).queue(theFirstThing) 
    .queue(theSecondThing) 
    .queue(theThirdThing); 

... và các chức năng khác sẽ không được gọi cho đến khi các chức năng trước đó cho biết đã hoàn thành.

Ví dụ:

$({}).queue(theFirstThing) 
 
    .queue(theSecondThing) 
 
    .queue(theThirdThing); 
 

 
function theFirstThing(next) { 
 
    // What I do is asynchronous: Fade out the a1 element, 
 
    // then call the next function in the chain if any 
 
    $("#a1").fadeOut("slow", next); 
 
} 
 
function theSecondThing(next) { 
 
    // What I do is synchronous 
 
    $("<p>Hi there</p>").appendTo(document.body); 
 
    
 
    // Chain to next if any 
 
    next(); 
 
} 
 
function theThirdThing(next) { 
 
    // What I do is asynchronous: Fade out the a2 element, 
 
    // then call the next function in the chain if any 
 
    $("#a2").fadeOut("slow", next); 
 
}

<div id="a1">a1</div> 
 
<div id="a2">a2</div> 
 
<div id="a3">a3</div> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

---

gốc trả lời:

The documentation cho chúng ta biết:

jQuery (object)

đối tượng
Loại: PlainObject
Một đối tượng đơn giản để quấn trong một đối tượng jQuery.

Ví dụ: nó bao bọc một cá thể jQuery xung quanh một đối tượng đơn giản. Chúng ta đã quen với các cá thể jQuery đang được bao quanh một hoặc nhiều phần tử DOM, nhưng chúng có thể được bao bọc xung quanh những thứ khác.

Sau đó họ đang làm queue trên kết quả các đối tượng jQuery:

.queue ([queueName], callback)

queueName
Loại: String
Một chuỗi chứa tên của hàng đợi. Mặc định là fx, hàng đợi hiệu ứng chuẩn.

callback
Type: Chức năng (Function tiếp theo())
Chức năng mới để thêm vào hàng đợi, với một hàm để gọi mà sẽ dequeue mục tiếp theo.

Vì vậy, cho chúng ta biết những gì nó làm: Bọc một đối tượng jQuery xung quanh một đối tượng đơn giản, sau đó gọi queue để đặt một cái gì đó trong hàng đợi hoạt hình mặc định cho rằng đối tượng jQuery, mặc dù không có các yếu tố trong nó để animate.

Tại sao mọi người sử dụng biểu mẫu này?

Tôi chưa bao giờ thấy được sử dụng. Tôi không thể nghĩ ra lý do nào để sử dụng nó như thể hiện trong câu hỏi của bạn, nó chỉ kết thúc lên gọi hàm ngay lập tức, trong queue cuộc gọi, như chúng ta có thể thấy ở đây:

$({}).queue(function(next){ 
 
    snippet.log("Function called"); 
 
    next(); 
 
}); 
 
snippet.log("queue call complete");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 --> 
 
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

Answer 2

Bất cứ khi nào không có ngữ cảnh nào được chuyển vào đối tượng jQuery, ngữ cảnh là được đặt thành 'tài liệu'. Vì $() không có ngữ cảnh, bối cảnh sau đó mặc định là tài liệu. Tương tự với việc thực hiện $ ([]) ans $ ({}).

Answer 3

Tôi đã sử dụng $ ({}) trước khi instantiating một biến mà sau này sẽ được thay thế bằng một đối tượng JQuery thực, do đó trong trường hợp của một kết quả bất ngờ, giá trị ban đầu vẫn là một đối tượng JQuery hợp lệ. Nó có thể không thực sự cần thiết trong trường hợp đó.

Khi kiểm tra, một khác biệt lớn giữa $() và $ ({}) là giá trị của .length. 0 và 1, tương ứng. Câu hỏi hay và trò chuyện. +1