> 웹 프론트엔드 > JS 튜토리얼 > JS 상속의 기생 상속

JS 상속의 기생 상속

小云云
풀어 주다: 2018-03-07 10:50:58
원래의
2165명이 탐색했습니다.

기생유산이라는 말을 들으면 겁이 나기 쉽습니다. 걱정하지 마십시오. 이 기사에서는 JS의 상속 방법을 이해하기 쉽게 설명하려고 합니다. 이것이 모든 사람에게 도움이 되기를 바랍니다.

1. 예

먼저 다음과 같이 형식 매개변수가 원본인 빈 함수를 정의합니다.

function createAnother(original){}
로그인 후 복사

이 함수에서 새 개체 복제를 생성합니다.

function createAnother(original){
    var clone=Object.create(original);
}
로그인 후 복사

복제 개체에 sayHi, sayHi 속성을 추가합니다. 함수:

function createAnother(original){
    var clone=Object.create(original);    clone.sayHi=function(){
        alert('hi');
    };
}
로그인 후 복사

마지막으로 복제 개체를 반환합니다.

function createAnother(original){
    var clone=Object.create(original);    clone.sayHi=function(){
        alert('hi');
    };    return clone;
}
로그인 후 복사

다음과 같은 개체가 있다고 가정합니다.

var person={
    name:'Nicholas',
    friends:['Shelby','Court','Van']
};
로그인 후 복사

위 개체를 실제 매개변수로 함수에 전달하여 실행합니다.

var anotherPerson=createAnother(person);
anotherPerson.sayHi();
로그인 후 복사

작업 결과는 다음과 같습니다. 안녕하세요'창이 뜹니다.

2. 의심스러운 점: 이 메서드와 프로토타입 상속 Object.create(o)의 차이점은 무엇인가요?

createAnother 함수에 다음 문장이 있는 것을 볼 수 있습니다.

var clone=Object.create(original);
로그인 후 복사

이것은 프로토타입 상속이 아닌가요?
실제로 프로토타입 상속 방식은 실제로 내부적으로 사용되며 최종 반환되는 객체는 복제 객체입니다. 그러나 프로토타입 상속과는 여전히 약간 다릅니다.
프로토타입 상속은 원래 객체의 속성을 상속하며 새 객체에는 새로운 추가 속성이 없습니다. 기생 상속은 내부적으로 새 객체에 속성을 추가할 수 있으며 새 객체는 외에도 원본 객체의 속성에는 내부적으로 추가된 속성이 있습니다.
위 예에는 프로토타입 상속과 비교하여 다음과 같은 추가 핵심 문이 있습니다.

    clone.sayHi=function(){
        alert('hi');
    };
로그인 후 복사

인스턴스를 생성한 후 인스턴스는 이 속성을 갖게 됩니다.

관련 추천:

여러 js 상속 스타일 공유

js 상속 Base class_js 객체 지향

js 상속_javascript 기술 구현 코드

의 소스 코드 분석

위 내용은 JS 상속의 기생 상속의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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