jQuery_jquery에서 인스턴스 생성과 프로토타입 상속의 비밀

new Object(), new Date() 등! (객체에는 {}가 있고 배열에는 []와 같은 단축키가 있습니다. 주로 new 메소드에 대해 논의합니다.)

jQuery를 사용할 때 new를 사용한 적이 없습니다. Woolen 천을 생성하기 위해 다른 메소드를 사용합니까? 프로토타입 속성을 사용하고 있지 않습니까? 사실 다 사용해봤지만 내부 처리가 매우 영리해서 사용 편의성이 향상되었습니다. 그의 소스코드를 살펴보자.

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

funtion jQuery(selector, context){
　return new jQuery.fn.init( selector, context );
}

여기서 jQuery에는 생성자가 있고 new는 인스턴스를 만드는 데 사용되는 것을 볼 수 있습니다. 그렇다면 jQuery.fn은 무엇입니까? 뒤에는 이런 과정이 있습니다.

코드를 복사하세요 코드는 다음과 같습니다.

jQuery.fn = jQuery .prototype={
init: function (){}
}

그래서 우리는 jQuery의 생성자가 함수 jQuery가 아니라 프로토타입의 init 메서드라는 것을 이해합니다. . 이 경우 $()가 호출될 때마다 jQuery 프로토타입에서 init를 사용하여 인스턴스를 생성하고 새로운 문제가 발생합니다. init를 사용하여 인스턴스를 생성하는 경우 이 객체는 init 프로토타입의 메서드를 상속하지만 jQuery 프로토타입의 메서드는 상속하지 않습니다. 그러면 프로토타입 상속을 어떻게 구현합니까?

jQuery.fn.init.prototype = jQuery.fn;
여기에는 jQuery.fn을 jQuery.fn.init.prototype에 할당하는 프로세스가 있습니다. 이것이 무엇인지 봅시다.

jQuery.fn은 jQuery.prototype입니다.

jQuery.fn.init.prototype은 jQuery.prototype.init.prototype입니다.

이 처리는
jQuery.prototype = jQuery.prototype.init.prototype

그런 다음 $()를 호출할 때마다 jQuery는 new 연산자를 사용하여 프로토타입에서 init를 호출하여 init에 의해 생성된 이 인스턴스가 상속됩니다. jQuery 프로토타입의 모든 메소드와 이 인스턴스의 __proto__ 내부 속성은 jQuery의 프로토타입 속성을 가리킵니다.

또한 다음 처리를 확인했습니다.

jQuery.fn = jQuery.prototype

이는 jQuery.prototype에서 빈번한 작업을 피하기 위한 것이므로 jQuery.fn이 캐시됩니다. jQuery.프로토타입.

이러한 처리는 정말 매우 영리합니다. 인스턴스 생성은 사용자가 인스턴스를 생성하기 위해 new를 사용할 필요 없이 내부적으로 처리되므로 리소스 지출을 줄이기 위해 여러 인스턴스가 공유되도록 합니다. .