2013-02-27 22 views
9

Có sự khác biệt nếu tôi làm:Cách xác định nội dung cần sử dụng - next(); hoặc dequeue() ;?

$queue.queue(function(next){ 
    //... 
    next(); 
}).queue(function(next){ 
    //... 
    next(); 
}); 

so

$queue.queue(function(){ 
    //... 
    $(this).dequeue(); 
}).queue(function(){ 
    //... 
    $(this).dequeue(); 
}); 

Họ làm điều tương tự?

Sự khác biệt và tôi nên sử dụng điều gì?

Đó là nguyên nhân gây ra tài liệu jQuery không thực sự đề cập đến .next(), họ luôn nói sử dụng .dequeue() nhưng tại nơi làm việc của tôi người sử dụng chức năng .next() vì vậy điều này đã cho tôi khá bối rối.

+0

Câu hỏi về [thẻ: tối ưu hóa] này như thế nào? – millimoose

+0

Điều gì 'next()' được ghi lại chỉ trong [tài liệu cho '.queue()'] (http://api.jquery.com/queue/#queue2): "Kể từ jQuery 1.4, hàm đó được gọi là được truyền chức năng khác như đối số đầu tiên. Khi được gọi, nó sẽ tự động khử đi mục tiếp theo và giữ cho hàng đợi chuyển động. " – millimoose

+0

Tôi đã thêm Tối ưu hóa vì, nó nêu rõ rằng tối ưu hóa là hành động cải thiện phương pháp hoặc thiết kế. Tôi đang tìm kiếm phương pháp tốt nhất để sử dụng các chức năng này vì vậy tôi đang tìm cách 'tối ưu hóa' mã của tôi ... Làm cho cảm giác 100% với tôi! – Epik

Trả lời

7

Điều đó tôi biết, không có sự khác biệt. Tôi không chắc tại sao người ta lại thích cái kia hơn hay tại sao cả hai đều được nhắc tới vì điều đó gây nhầm lẫn cho tôi.

Nhìn vào http://code.jquery.com/jquery-1.9.1.js chúng ta thấy:

1915 next = function() { 
     jQuery.dequeue(elem, type); 
    }; 

... trong phương pháp jQuery.dequeue. Điều này được gọi một chút sau đó (trên dòng 1936) là fn.call(elem, next, hooks). Bạn thấy rằng next là thông số đầu tiên trong gọi lại queuefnqueue tại thời điểm đó.

Nhìn về phía trước, chúng ta thấy

1983 dequeue: function(type) { 
     return this.each(function() { 
      jQuery.dequeue(this, type); 
     }); 
    }, 

này được xác định trên jQuery.fn, vì vậy đó là chức năng gọi bằng $(this).dequeue. Tuy nhiên, điều này thực hiện chính xác điều tương tự. Sự khác biệt duy nhất là phần tử bị khử. Trong fn.dequeue nó lặp lại trên bộ sưu tập, nhưng đó sẽ chỉ là một phần tử cho $(this).

Nếu chúng ta nhìn lại, chúng ta thấy những gì elem là mặc dù:

1908 dequeue: function(elem, type) { 

... hey, chờ một giây .. nó this (khi gọi từ $(this).dequeue)! Vì vậy, bạn có thể thấy rằng họ làm chính xác điều tương tự. Tuy nhiên, $("some other collection").dequeue sẽ hoạt động khác nhau.

Gọi next() giúp bạn nhận thêm một cuộc gọi .each, vì vậy tôi đoán điều đó sẽ nhanh hơn.

Nhân tiện, bạn không phải gọi số next trong cuộc gọi lại vì bạn có thể đổi tên tham số thành bất kỳ thứ gì bạn muốn.

EDIT: mỗi mini-thảo luận của tôi với đồng nghiệp lừng lẫy của tôi @ FabrícioMatté, có thể thực sự là một sự khác biệt về tính năng giữa next()$(this).dequeue(), đặc biệt là khi không sử dụng các tiêu chuẩn fx đợi. Khi chức năng next được tạo, nó được thiết lập để gọi $.dequeue với loại được mua từ queue rồi, nhưng $.fn.dequeue lấy loại làm đối số.Đây có thể là động lực hơn nữa để gắn bó với next(), mặc dù tôi chưa bao giờ thực sự thấy ai đó sử dụng bất cứ thứ gì khác ngoài hàng đợi hiệu ứng chuẩn thực tế.

+0

Rất tốt giải thích cảm ơn bạn. Nó có ý nghĩa bây giờ khi đặt ra cách bạn có. – Epik

+0

+1 để biết về hàng đợi không phải là 'fx', cũng đã chỉnh sửa câu trả lời của tôi để tuân thủ điều đó. '=]' –

4

Cả hai jQuery.fn.dequeue và hàm next chỉ đơn giản là trình bao bọc cho jQuery.dequeue, chuyển cùng một bộ đối số trong cả hai ví dụ của bạn.


(Đến nay như jQuery 1.9.1)

Đối với các thông số chức năng tiếp theo: type là một tham số tùy chọn chỉ ra hàng đợi, mặc định là fx đó là hàng đợi hoạt hình mặc định của jQuery. element là tham chiếu phần tử DOM.

$.fn.dequeue:

dequeue: function(type) { 
    return this.each(function() { 
     jQuery.dequeue(this, type); 
    }); 
} 

$().dequeue chỉ đơn giản gọi $.dequeue cho mỗi phần tử chứa bên trong đối tượng jQuery.

Trường hợp sử dụng của bạn $(this).dequeue() sẽ gọi $.dequeue một lần duy nhất với yếu tố ban đầu tham chiếu theo this.

Tương tự, next sẽ vượt qua một tài liệu tham khảo đơn yếu tố để $.dequeue, đó là yếu tố hiện có hàng đợi của nó dequeued:

next = function() { 
    jQuery.dequeue(elem, type); 
}; 

Nói cách khác, đây là cơ bản giống. next trực tiếp hơn một chút vì nó không có trình bao bọc lặp lại, do đó next() phải là một số micro giây nhanh hơn $.fn.dequeue().

Sự khác biệt chính là bạn có thể gọi .dequeue() trên nhiều yếu tố và nó sẽ loại bỏ từng phần tử trong khi next() được liên kết trực tiếp với phần tử có hàng đợi bị xóa.

Đối với trường hợp sử dụng nơi bạn có $(this).dequeue() bên trong gọi lại, điều này không liên quan. $.fn.dequeue hữu ích khi bắt đầu khử một hoặc nhiều phần tử. $(this).dequeue() có kết quả tương đương hơn next(), nhưng sau này sẽ cung cấp một micro giây trong trường hợp này.


Theo ghi nhận của @Explosion Thuốc trong các ý kiến, có chưa có thêm một nét đặc biệt khi giao dịch với phi fx hàng đợi:

$(this).dequeue() mà không có sự tranh luận type sẽ dequeue hàng đợi mặc định (fx) do đó, các hàng đợi không phải là fx yêu cầu tên được chuyển làm tham số cho .dequeue(), trong khi .next() tìm kiếm chuỗi phạm vi sáng tạo của nó và tự động truy xuất type bên trong phạm vi $.dequeue() đã tạo t anh ta next đối tượng chức năng.

Do đó, khi sử dụng hàng đợi không phải là fx, bạn sẽ phải chuyển tên hàng đợi đến $().dequeue(queueIdentifier), trong khi .next() sẽ luôn luôn khử theo hàng đợi gọi lại của bạn.

+0

Tôi sắp sửa sửa câu trả lời của mình để nhận xét về thực tế là '$ .fn.dequeue' lấy' kiểu' làm đối số, nhưng 'next' được định nghĩa với' type' được lấy từ ràng buộc 'queue'. Điều này có nghĩa là '$ (this) .dequeue' dường như không hoạt động với các hàng đợi không phải 'fx' mà không có đối số bổ sung trong khi' next() 'sẽ. Điều đó có đúng với bạn không? –

+0

@ExplosionPills Vâng, tuyệt đối. '$ (this) .dequeue()' không có đối số 'type' sẽ loại bỏ hàng đợi mặc định (' fx') để các hàng đợi không phải 'fx' yêu cầu tên hàng đợi được chuyển thành tham số trong khi '.next()' " kế thừa "kiểu' đã truyền trước đó ". Nice spot. '=]' –

Các vấn đề liên quan