jQuery 2부 읽기(두 가지 확장)_jquery

다음과 같습니다

코드를 복사합니다 코드는 다음과 같습니다.

jQuery.extend = jQuery. fn.extend = function () {
...
};

$.extend를 사용하여

과 같은 사용자 정의 개체를 확장할 수 있습니다. 코드 복사 코드는 다음과 같습니다.

var own = {name:jack}
$.extend(myself, {setName: function(n) {this.name=n;} });
myself.setName("tom")

setName 메소드는 $를 통해 직접 객체에 추가됩니다. .연장하다. 하지만 여기서는 $.extend가 jQuery 라이브러리를 빌드하는 방법을 주로 논의합니다. 위 코드의 jQuery.extend와 jQuery.fn.extend가 같은 함수인지는 몰랐습니다. 우리는 jQuery 라이브러리를 탐색한 결과 일부 메소드는 jQuery.extend를 호출하여 확장되고 일부는 jQuery.fn.extend를 호출하여 확장된다는 것을 발견했습니다.
아래에서 별도로 논의합니다.
1. jQuery.extend를 통한 확장
우리는 jQuery.extend의 ​​jQuery 유형이 function, 즉 jQuery 값의 유형이 "function"이라는 것을 알고 있습니다. jQuery가 클래스로 간주되는 경우 jQuery.extend는 클래스에 정적 메서드 확장을 추가하는 것과 동일합니다. 정적 메서드는 새 인스턴스를 호출할 필요가 없으며 "클래스 이름 + 메서드 이름"을 통해 직접 호출됩니다. 즉, jQuery.extend(...), jQuery가 $에 할당됩니다. 그러므로 우리는 $.extend(...)에 더 익숙합니다.
jQuery.extend 메소드는 소스 코드에서 직접 호출되며 하나의 매개변수만 전달합니다. 다음과 같습니다

코드를 복사합니다 코드는 다음과 같습니다.

jQuery.extend({
noConflect: function ( deep ) {
window.$ = _$;
if ( deep )
window.jQuery =
return jQuery; ..
})


extend에 하나의 매개변수만 전달되면 이 문장이 실행된다는 것을 알고 있습니다.

코드 복사 코드는 다음과 같습니다.

if ( length === i ) {

target = this
-i }


즉, 자신을 확장하는 것, 이것이 바로 jQuery 함수입니다. 즉, jQuery 함수에 많은 정적 메소드가 추가되었습니다. 이러한 메소드는 $(와 같이 jQuery 메소드를 먼저 실행(호출)한 후 xx를 호출하는 대신 jQuery.xx(또는 $.xx)를 통해 직접 호출할 수 있습니다. "#ID").xx. 아마도 다음 예가 더 이해하기 쉬울 것입니다.

코드 복사 코드는 다음과 같습니다. function fun(){ }//클래스 정의(함수)

//정적 메서드 추가 확장

fun.extend=function(obj){
for(var a in obj)
this [a] = obj[a];//참고: 여기 tihs는 재미있습니다
}
//extend를 호출하면 정적 속성 이름이 클래스에 추가되고 정적 메서드 method1
fun.extend({ name:"fun",method1:function(){}});
//출력 이름, 프로토타입, 확장, 메소드1
console.dir(fun)


따라서 jQuery는 isFunction, isArray, isWindow 등은 모두 정적 메서드이며 $.isFunction, $.isArray, $.Window를 통해서만 참조할 수 있습니다. $("...").isFuction, $("...").isArray, $("...").isWindow를 통해 참조할 수 없습니다.
2, jQuery.fn.extend를 통해 확장

jQuery.fn은 jQuery.prototype과 동일합니다. 이는 jQuery 함수의 프로토타입에 확장 메소드가 첨부된다는 의미입니다. jQuery.fn.extend(object)를 호출하여 확장할 때(단 하나의 매개변수 객체만 전달됨) 확장 함수는 여전히

코드 복사 코드는 다음과 같습니다. if ( length === i ) { target = this

--i;

이때 jQuery.prototype 입니다(먼저 언급되는 것은 jQuery 함수 자체입니다). 즉, jQuery.prototype에는 많은 속성과 메소드가 추가됩니다. $() 또는 jQuery()와 같은 jQuery 함수가 실행되면 $()가 더 자주 발생합니다. 이 함수는 새로운 jQuery를 생성합니다(jQuery 객체 구성에 대한 이전 기사 참조). 이때 확장된 속성과 메소드는 new로 생성된 객체에 첨부됩니다. 아마도 다음 예가 이해하기 더 쉬울 것입니다.

코드 복사

코드는 다음과 같습니다.

function fun(){}//클래스 정의(함수)
//클래스 프로토타입에 확장된 메서드 추가
fun.prototype.extend = function(obj){
for(var a in obj)
this[a] = obj[a];//참고: 여기는 fun.prototype입니다.
}
//fun.prototype에서 확장 메소드를 호출하세요. 속성, 메소드
fun.prototype.extend({name:"fun2",method1:function(){}})
//출력 이름,extend,method1
console.dir(new fun( ) )

그래서 확장된 속성이나 메서드가 jQuery 개체에 추가됩니다. 예를 들어 $("...").bind, $("...").one, $("...").unbind를 통해 바인딩, one, unbind 등을 호출할 수 있습니다. 하지만 $.bind, $.one, $.unbind를 통해서는 호출할 수 없습니다.
jQuery는 Prototype과 마찬가지로 확장 메소드를 통해 전체 라이브러리를 확장합니다. 상대적으로 말하면 jQuery의 확장 방법은 이해하기가 더 어렵습니다.
요약은 다음과 같습니다.
1. jQuery.extend({...})는 jQuery 함수에 정적 속성이나 메서드를 추가하는 것입니다.
2. jQuery().extend({...})는 jQuery 객체에 속성이나 메서드를 추가하는 것입니다.
/js/2011/zchain/zchain-0.2.js