JavaScript_js 객체 지향에서 상속을 구현하는 세 가지 방법-JS 튜토리얼-php.cn

1. 프로토타입 체인 상속
프로토타입 체인 상속 측면에서 JavaScript는 Java, C# 등의 언어와 유사하며 단일 상위 클래스 상속만 허용합니다. 프로토타입 상속의 기본 방식은 다음과 같습니다.

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

 
function Parent(){ } 
function Child(){} 
Child.prototype = new Parent() 

Child 객체의 프로토타입 속성은 부모 개체 부모(Child 개체 인스턴스가 전달될 수 있도록) 프로토타입 체인은 부모 개체의 구성에 의해 정의된 속성, 메서드 등에 액세스합니다.
프로토타입 체인을 통해 상위 객체를 연결하는 구조는 객체의 상속이 완료된다는 뜻인가요? 대답은 '아니요'입니다. 예:

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

 
function Parent(){} 
function Child(){} 
Child.prototype = new Parent(); 
var child = new Child() 
alert(child.constructor);//function Parent(){} 
alert (child 인스턴스 of Child);//true 

child는 여전히 Child의 인스턴스로 사용될 수 있지만, 현재 인스턴스 child의 원래 객체 구성 정보는 손실되었습니다. 해당 결함을 보완하는 방법은 다음과 같습니다.

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

 
function Parent(){ } 
function Child(){} 
Child.prototype = new Parent() 
Child.prototype.constructor = Child; 
var child = new Child( ); 
alert(child .constructor);//function Parent(){} 
alert(child 인스턴스of Child);//true 

　위 코드 스니펫에서 볼 수 있듯이 " Child.prototype.constructor = Child", 개체 생성자 Child의 프로토타입을 명시적으로 지정하여 모든 Child 개체 인스턴스가 Child로 구성되도록 강제합니다.
2. 적용 및 호출 메소드 사용
JavaScript 내장 Function 객체의 적용 및 호출 메소드는 객체 구성에서 "this"의 컨텍스트를 변경하므로 특정 객체 인스턴스에는 정의된 속성과 메서드가 있습니다.
적용 및 호출 상속을 사용하는 것은 실제 개발 시 HTML 페이지에서 DOM 객체를 조작할 때 특히 일반적입니다. 예:

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

적용, 상속 호출

Apply 또는 call로 정의된 ext 메소드를 통해 ext 메소드 내부의 this 컨텍스트는 DOM 객체 "

apply,call 상속 적용 또는 호출을 사용할 때 다음과 같이 객체 구성에 의해 정의된 코드 세그먼트가 직접 실행된다는 점에 유의할 가치가 있습니다.

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