(전재)jQuery.extend 함수 설명

jQuery는 다음과 같은 두 가지 방법으로 플러그인을 개발합니다.
JavaScript 코드
jQuery.fn.extend(object);
jQuery.extend(object);
jQuery.extend(object); jQuery 클래스 자체를 확장하기 위해서입니다.클래스에 새로운 방법을 추가합니다.
jQuery.fn.extend(object);jQuery 객체에 메서드를 추가합니다.
fn이 뭐지?jQuery 코드를 보면 쉽게 찾을 수 있습니다.
JavaScript 코드

jQuery.fn = jQuery.prototype = {       
　　　init: function( selector, context ) {//….　    

　　　//……    

};    

원래 jQuery.fn = jQuery.prototype.프로토타입이 낯설지 않을 거예요.
자바스크립트는 명확한 클래스 개념이 없지만 클래스로 이해하면 더욱 편리하다.
jQuery는 아주 잘 봉인된 클래스입니다. 예를 들어 우리는 문장 $("#btn1〃) 를 사용하면 jQuery 클래스의 실례를 만들 수 있습니다.
jQuery.extend(object);jQuery 클래스에 클래스를 추가하는 방법은 정적 방법을 추가하는 것으로 이해할 수 있습니다.예:
XML/HTML 코드
4

$.extend({    

　　add:function(a,b){return a+b;}    

});    

jQuery에dd의'정적 방법'을 추가하면 jQuery를 도입한 곳에서 이 방법을 사용할 수 있습니다.
JavaScript 코드
$.add(3,4);//return 7
jQuery.fn.extend(object); 그래, jQuery.prototype 확장은 jQuery 클래스에 '구성원 함수' 를 추가하는 것입니다.jQuery 클래스의 실례는 이 '구성원 함수' 를 사용할 수 있습니다.
예를 들어 우리는 플러그인을 개발하여 특수한 편집 상자를 만들어야 한다. 이 플러그인이 눌렸을 때, 현재 편집 상자의 내용을 알 수 있다.다음을 수행할 수 있습니다.
JavaScript 코드

$.fn.extend({         

     alertWhileClick:function(){         

         $(this).click(function(){         

              alert($(this).val());         
          });         

      }         

});  

$("#input1〃).alertWhileClick();//페이지는 다음과 같습니다.
("#input1〃)는 jQuery 실례로 구성원 방법인alertWhileClick을 호출하면 확장이 이루어지고 클릭할 때마다 현재 편집된 내용을 먼저 팝업합니다.
실제 개발 과정에서 당연히 이렇게 작은 플러그인을 만들지 않을 것이다. 사실 jQuery는 풍부한 조작 문서, 이벤트, CSS, Ajax, 효과 방법을 제시했고 이런 방법을 결합하면 더욱 Niubility 플러그인을 개발할 수 있다.
참고:
여기에 또 하나의 특수한 점이 있다. 바로 함수가 시작되는 곳에 jQuery가 있다는 것이다.extend = jQuery.fn.extend, 프로그램 앞에서 jQuery.prototype은 jQuery에 값을 부여합니다.fn이므로 다음 호출에서 jQuery가 나타납니다.extend() 및 jQuery.fn.extend () 의 호출에 따라 이 두 방법의 호출 결과도 다르다. jQuery.extend () 의 호출은 대상의 실례에 방법을 확장하지 않으며, 인용하는 방법도 jQuery 클래스를 통해 이루어져야 한다. 예를 들어 jQuery.init(), jQuery.fn.extend () 의 호출은 대상의prototype에 방법을 확장하기 때문에 jQuery 대상을 실례화할 때 이러한 방법을 가지게 됩니다. 이것은 매우 중요합니다. jQuery에서.js에서 도처에서 이 점을 구현하였다.
JQuery의 extend 확장 방법:
Jquery의 확장 방법인 extend는 플러그인을 쓰는 과정에서 자주 사용하는 방법입니다. 이 방법은 원형을 다시 불러오는 방법이 있습니다. 여기서 함께 알아보겠습니다.
1. Jquery의 확장 방법의 원형은 다음과 같다.

 extend(dest,src1,src2,src3...);

그것의 의미는 src1, src2, src3...dest에 합병되면 반환값은 합병된 dest로 이 방법이 합병된 후에 dest의 구조를 수정한 것을 알 수 있다.Dest 구조를 수정하지 않고 결합 결과를 얻으려면 다음과 같이 하십시오.

 var newSrc=$.extend({},src1,src2,src3...)//    "{}"  dest  。

이렇게 하면 src1, src2, src3을...병합을 진행한 다음 병합 결과를 newSrc에 되돌려줍니다.예를 들면 다음과 같습니다.

var result=$.extend({},{name:"Tom",age:21},{name:"Jerry",sex:"Boy"})

그럼 합병된 결과.

  result={name:"Jerry",age:21,sex:"Boy"}

즉 뒤의 매개 변수가 앞의 매개 변수와 같은 이름이 존재하면 뒤의 매개 변수는 앞의 매개 변수 값을 덮어쓴다.
2. dest 매개 변수 생략
상기 extend 방법의 원형에 있는 dest 매개 변수는 생략할 수 있습니다. 생략하면 이 방법은 하나의 src 매개 변수만 있고, 이 src를 extend 방법을 호출하는 대상에 통합합니다. 예를 들어:
　　1、$.extend(src)
이 방법은 src를 jquery의 전역 대상에 통합하는 것입니다. 예를 들어:

 $.extend({  hello:function(){alert('hello');}  });

Hello 방법을 jquery의 전역 대상에 통합하는 것입니다.
　　2、$.fn.extend(src)
이 방법은 src를 jquery의 실례 대상에 통합시킨다. 예를 들어 다음과 같다.

 $.fn.extend({  hello:function(){alert('hello');} });

바로 Hello 방법을 jquery의 실례 대상에 통합하는 것입니다.
다음은 일반적인 확장 인스턴스 몇 가지를 예로 들겠습니다.

$.extend({net:{}});

이것은 jquery 전역 대상에서 넷 이름 공간을 확장하는 것입니다.

  $.extend($.net,{   hello:function(){alert('hello');}  })

이것은 Hello 방법을 이전에 확장된 Jquery의 net 이름 공간으로 확장하는 것입니다.
셋째, Jquery의 extend 메서드에는 프로파일을 다시 로드하는 방법도 있습니다.

extend(boolean,dest,src1,src2,src3...)

첫 번째 파라미터boolean은 깊이 복사를 하는지 여부를 대표하고 나머지 파라미터는 앞에서 소개한 것과 일치한다. 심층 복사가 무엇인지 우리는 하나의 예를 본다.

var result=$.extend( true,  {},      { name: "John", location: {city: "Boston",county:"USA"} },      { last: "Resig", location: {state: "MA",county:"China"} } ); 

우리는 src1에 끼워 넣은 하위 대상location: {city: "Boston"}, src2에도 끼워 넣은 하위 대상location: {state: "MA"}, 첫 번째 깊이 복사 파라미터가true인 것을 알 수 있다. 그러면 합병된 결과는 다음과 같다.

result={name:"John",last:"Resig",        location:{city:"Boston",state:"MA",county:"China"}}

즉, 이것은 src의 끼워 넣은 하위 대상도 합병할 것이다. 첫 번째 파라미터인boolean이false라면, 합병의 결과가 무엇인지 살펴보자. 다음과 같다.

var result=$.extend( false, {},  { name: "John", location:{city: "Boston",county:"USA"} },  { last: "Resig", location: {state: "MA",county:"China"} } 

);
그러면 합병 후의 결과는 다음과 같다.

result={name:"John",last:"Resig",location:{state:"MA",county:"China"}}

이상은 $입니다.extend () 는 프로젝트에서 자주 사용하는 세부 사항입니다.
게시물: [url]http://www.cnblogs.com/wyjgreat/archive/2011/07/19/2110754.html
http://www.cnblogs.com/RascallySnake/archive/2010/05/07/1729563.html[/url]