jQuery 라이브러리에서 사용되는 디자인 패턴

Question 1

jQuery는 DOM에 매우 중점을두고 있으며 그 주위에 멋진 추상화를 제공합니다. 그렇게하면서 어제 저를 강타했던 잘 알려진 다양한 디자인 패턴 을 활용합니다. 한 가지 분명한 예는 Decorator 패턴입니다. jQuery 객체는 일반 DOM 객체에 대한 새롭고 추가 기능을 제공합니다.

예를 들어 DOM에는 기본 insertBefore 메서드가 있지만 해당하는 insertAfter 메서드가 없습니다. 이 차이를 채우기 위해 사용할 수 있는 다양한 구현 이 있으며 jQuery는이 기능을 제공하는 라이브러리 중 하나입니다.

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

jQuery에서 많이 사용되는 Decorator 패턴의 다른 많은 예가 있습니다.

라이브러리 자체의 일부인 디자인 패턴의 크거나 작은 다른 예는 무엇입니까? 또한 패턴의 사용 예를 제공하십시오.

사람들이 jQuery에 대해 좋아하는 다양한 것들이 패턴의 이름으로 일반적으로 참조되지 않는 잘 알려진 디자인 패턴으로 거슬러 올라갈 수 있다고 믿기 때문에 이것을 커뮤니티 위키로 만듭니다. 이 질문에 대한 답은 없지만 이러한 패턴을 분류하면 라이브러리 자체에 대한 유용한 통찰력을 얻을 수 있습니다.

Question 2

지연 초기화 :

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

어댑터 또는 래퍼

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

정면

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

관찰자

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

반복자

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

전략

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

대리

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

빌더

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

원기

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

플라이급

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

Question 3

복합 패턴도 매우 일반적으로 jQuery를 사용한다. 다른 라이브러리와 함께 작업 한 결과,이 패턴이 첫눈에 보이는 것처럼 명확하지 않은 것을 알 수 있습니다. 패턴은 기본적으로 이렇게 말합니다.

개체 그룹은 개체의 단일 인스턴스와 동일한 방식으로 처리됩니다.

예를 들어 단일 DOM 요소 또는 DOM 요소 그룹을 다룰 때 둘 다 균일 한 방식으로 처리 할 수 있습니다.

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

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

Question 4

YUI에 대한이 기사에서 논의 된 Singleton / Module 패턴은 어떻습니까? http://yuiblog.com/blog/2007/06/12/module-pattern/

나는 jQuery가이 패턴을 핵심에서 사용하고 플러그인 개발자가 패턴을 사용하도록 장려한다고 믿는다. 이 패턴을 사용하면 전역 네임 스페이스를 깔끔하게 정리할 수있는 편리하고 효율적인 방법이며, 이는 개발자가 깔끔하고 캡슐화 된 코드를 작성하는 데 도움을줌으로써 더욱 유용합니다.

Question 5

함수형 프로그래밍의 관점에서 jQuery는 Monad입니다. Monad는 객체를 액션에 전달하고 수정 된 객체를 반환하고 다음 액션에 전달하는 구조입니다. 조립 라인처럼.

위키 백과 문서는 매우 잘 정의를 포함한다.