> 웹 프론트엔드 > JS 튜토리얼 > JavaScript 프로토타입 상속: `Derived.prototype = new Base`에서 `new`의 역할은 무엇입니까?

JavaScript 프로토타입 상속: `Derived.prototype = new Base`에서 `new`의 역할은 무엇입니까?

Mary-Kate Olsen
풀어 주다: 2024-12-24 09:46:20
원래의
651명이 탐색했습니다.

What is the Role of `new` in JavaScript Prototypal Inheritance: `Derived.prototype = new Base`?

"Derived.prototype = new Base"에서 'new' 역할 이해

다음 코드 조각을 고려하세요.

WeatherWidget.prototype = new Widget;
로그인 후 복사

여기서 Widget은 생성자를 나타내며, 우리의 목표는 WeatherWidget이라는 새로운 함수를 사용하여 이를 확장하는 것입니다. 질문이 생깁니다: 이 맥락에서 new 키워드의 중요성은 무엇이며, 이를 생략하면 어떤 결과가 발생합니까?

'new'의 역할

new 키워드는 중요한 작업을 수행합니다. Widget을 생성자로 인스턴스화하고 그 반환 값을 WeatherWidget의 프로토타입 속성에 할당함으로써 가능합니다. new 키워드가 없는 경우 인수를 제공하지 않고(예: 괄호 생략) Widget을 호출하면 정의되지 않은 동작이 발생합니다. 게다가 Widget의 구현이 생성자로 호출되도록 설계되지 않은 경우 이 접근 방식은 전역 네임스페이스를 실수로 오염시킬 수 있습니다.

상속된 인스턴스 동작

시연된 대로 new 키워드를 사용하면 의 모든 인스턴스가 WeatherWidget은 동일한 Widget 인스턴스를 상속하여 다음과 같은 프로토타입을 생성합니다. 체인:

[new WeatherWidget()] → [new Widget()] → [Widget.prototype] → …
로그인 후 복사

이 특정 배열은 모든 WeatherWidget 인스턴스가 Widget 인스턴스에서 상속된 속성 값을 공유하려는 경우에 적합할 수 있습니다. 그러나 대부분의 경우 이러한 공유 상속은 바람직하지 않습니다.

적절한 클래스 기반 상속

프로토타입을 사용하는 JavaScript에서 클래스 기반 상속을 효과적으로 구현하려면 다음 접근 방식을 권장합니다.

function Dummy () {}
Dummy.prototype = Widget.prototype;
WeatherWidget.prototype = new Dummy();
WeatherWidget.prototype.constructor = WeatherWidget;
로그인 후 복사

이 기술은 WeatherWidget 인스턴스가 프로토타입 체인을 통해 속성을 적절하게 상속하지만 프로토타입을 상속하기 때문에 인스턴스 간에 속성 값을 공유하지 않도록 보장합니다. 중간 더미 생성자에서. 결과 프로토타입 체인은 다음과 같습니다.

[new WeatherWidget()] → [new Dummy()] → [Widget.prototype] → …
로그인 후 복사

최신 JavaScript 기능 활용

ECMAScript 5 이상을 준수하는 최신 JavaScript 구현에서는 다음 접근 방식이 선호됩니다.

WeatherWidget.prototype = Object.create(Widget.prototype, {
  constructor: {value: WeatherWidget}
});
로그인 후 복사

이 접근 방식은 열거할 수 없고 구성할 수 없는 생성자를 생성할 수 있다는 추가적인 이점이 있습니다.

상위 생성자 호출

마지막으로, 상위 생성자(이 경우 Widget)는 하위 생성자(WeatherWidget) 내에서만 명시적으로 호출된다는 점에 유의하는 것이 중요합니다. 적용 또는 호출 방법을 사용하는 방법:

function WeatherWidget (…)
{
  Widget.apply(this, arguments);
}
로그인 후 복사

위 내용은 JavaScript 프로토타입 상속: `Derived.prototype = new Base`에서 `new`의 역할은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿