Câu hỏi Các mẫu thiết kế được sử dụng trong thư viện jQuery


jQuery tập trung cao vào DOM và cung cấp một trừu tượng tốt đẹp xung quanh nó. Khi làm như vậy, nó sử dụng rất nhiều mẫu thiết kế vừa mới đánh tôi ngày hôm qua. Một ví dụ rõ ràng sẽ là Trang trí mẫu. Đối tượng jQuery cung cấp chức năng mới và bổ sung xung quanh một đối tượng DOM thông thường.

Ví dụ: DOM có nguồn gốc chèn trước nhưng không có phương thức insertAfter tương ứng. Có nhiều cách triển khai khác nhau có sẵn để lấp đầy khoảng trống này và jQuery là một trong những thư viện cung cấp chức năng này:

$(selector).after(..)
$(selector).insertAfter(..)

Có rất nhiều ví dụ khác về mẫu Decorator được sử dụng nhiều trong jQuery.

Các ví dụ khác, lớn hay nhỏ, về các mẫu thiết kế nào mà bạn nhận thấy là một phần của chính thư viện? Ngoài ra, vui lòng cung cấp ví dụ về cách sử dụng mẫu.

Làm cho wiki này trở thành một cộng đồng như tôi tin rằng những thứ khác nhau mà mọi người yêu thích về jQuery có thể được bắt nguồn từ các mẫu thiết kế nổi tiếng, chỉ là chúng không thường được gọi bằng tên của mẫu. Không có câu trả lời cho câu hỏi này, nhưng việc lập danh mục các mẫu này sẽ cung cấp một cái nhìn sâu sắc hữu ích vào chính thư viện đó.


76


gốc




Các câu trả lời:


Khởi tạo Lazy:

$(document).ready(function(){
    $('div.app').myPlugin();
});

Bộ điều hợp hoặc trình bao bọc

$('div').css({
    opacity: .1 // opacity in modern browsers, filter in IE.
});

Mặt tiền

// higher level interfaces (facades) for $.ajax();
$.getJSON();
$.get();
$.getScript();
$.post();

Người quan sát

// jQuery utilizes it's own event system implementation on top of DOM events.
$('div').click(function(){})
$('div').trigger('click', function(){})

Iterator

$.each(function(){});
$('div').each(function(){});

Chiến lược

$('div').toggle(function(){}, function(){});

Ủy quyền

$.proxy(function(){}, obj); // =oP

Người xây dựng

$('<div class="hello">world</div>');

Prototype

// this feels like cheating...
$.fn.plugin = function(){}
$('div').plugin();

Flyweight

// CONFIG is shared
$.fn.plugin = function(CONFIG){
     CONFIG = $.extend({
         content: 'Hello world!'
     }, CONFIG);
     this.html(CONFIG.content);
}

89



công việc tốt đẹp ở đó :) .. Tôi nghĩ rằng mô hình mặt tiền cho $.ajax tương tự như Phương thức mẫu như chúng ta có chức năng cơ sở, và mỗi phương thức bổ sung như $.get ghi đè cơ sở và làm cho nó cụ thể hơn. - Anurag
Yeh, rất nhiều phương pháp jQuery và JavaScript thực sự nói chung có thể tuân thủ vô số các mẫu thiết kế cùng một lúc. Đó là một ví dụ điển hình về sức mạnh biểu đạt của JavaScript nói chung và cách lập trình chức năng có thể bổ sung cho lập trình hướng đối tượng. =) - BGerrissen


Các Composite mô hình cũng rất thường được sử dụng trong jQuery. Đã làm việc với các thư viện khác, tôi có thể thấy mô hình này không rõ ràng như thế nào khi nhìn vào cảnh đầu tiên. Mô hình cơ bản nói rằng,

một nhóm các đối tượng sẽ được xử lý giống như một cá thể của một đối tượng.

Ví dụ, khi giao dịch với một phần tử DOM đơn lẻ hoặc một nhóm các phần tử DOM, cả hai có thể được xử lý một cách thống nhất.

$('#someDiv').addClass('green'); // a single DOM element

$('div').addClass('green');      // a collection of DOM elements

13





Làm thế nào về mô hình Singleton / Module, như đã thảo luận trong bài viết này về YUI: http://yuiblog.com/blog/2007/06/12/module-pattern/

Tôi tin rằng jQuery sử dụng mẫu này trong lõi của nó, cũng như khuyến khích các nhà phát triển trình cắm thêm sử dụng mẫu đó. Sử dụng mẫu này là một cách tiện dụng và hiệu quả để giữ không gian tên toàn cầu rõ ràng là lộn xộn, điều này hữu ích hơn nữa bằng cách hỗ trợ các nhà phát triển viết mã sạch, đóng gói.


5



jQuery sử dụng mô-đun mô-đun ở những nơi khác nhau trong lõi của nó, và cũng đề xuất nó cho các nhà phát triển plugin cho nhiều plugin nhỏ hơn. Great tìm :) - Anurag


Trong con mắt lập trình hàm, jQuery là một Monad. Một Monad là một cấu trúc chuyển một đối tượng tới một hành động, trả về đối tượng đã sửa đổi và chuyển nó cho hành động tiếp theo. Giống như một dây chuyền lắp ráp.

Các Bài viết trên Wikipedia bao gồm định nghĩa rất tốt.


2



Tôi nghĩ đơn nguyên ở đây có nghĩa là khả năng chuỗi của thư viện! - Jebin
Đó chính xác là những gì tôi mô tả ở đây. - nimrod