자바 script 의 계승 체 제 를 깊이 이해 하 는 12 가지 계승 모델 총화

이전에 우 리 는 여러 가지 javascript 중의 계승 방식 을 소 개 했 고 마지막 으로 우 리 는 이러한 계승 방식 을 요약 하기 시작 했다. 먼저 javascript 중의 계승 분 류 를 서로 다른 조건 에 따라 서로 다른 유형 으로 나 눌 수 있다.가장 자주 사용 하 는 우 리 는 이 두 가지 로 나 눌 수 있다.

구조 기 를 바탕 으로 하 는 계승 모델

대상 기반 계승 모델

또는 우리 도 다음 과 같이 분류 할 수 있다.

원형 사용 여부

속성 복사 사용 여부

원형 을 사 용 했 고 속성 복사 도 사용 했다

자 바스 크 립 트 의 계승 모델 을 정리 해 보도 록 하 겠 습 니 다.
원형 체인 법
예시:

Child.prototype = new Parent();

분류: 원형 구조 기 기반 계승 모델 을 사용 하 였 습 니 다.
* * 주의 * *:

기본 적 인 계승 체제

우 리 는 다시 사용 해 야 할 속성 과 방법 을 원형 으로 옮 길 수 있 고 다시 사용 하지 않 아 도 되 는 것 은 자신의 속성

으로 할 수 있다.
원형 으로 만 계승 하 다.
실례:

Child.prototype = Parent.prototype;

분류: 구조 기 모드 를 바탕 으로 원형 대상 을 복제 하고 원형 체인 의 관계 가 없습니다. 모두 하나의 원형 대상 을 공유 하기 때 문 입 니 다 * * 주의 * *:

효율 이 더욱 높 고 불필요 한 인 스 턴 스 가 new 에 의 해 나 오지 않 습 니 다

원형 속성 찾기 가 빠 릅 니 다. 원형 체인 관계 가 존재 하지 않 기 때 문 입 니 다

모두 같은 원형 을 바탕 으로 하기 때문에 하위 대상 에 대한 수정 은 부모 대상

에 영향 을 줄 수 있다.
임시 구조 기
실례

function extend(Child,Parent) {
var F = function(){};
F.prototype = Parent.prototype;
Child.prototype = new F();
Child.prototype.constructor = Child;
Child.uber = Parent.prototype;
}

분류: 구조 기 모드 를 바탕 으로 원형 체인 을 사 용 했 습 니 다 * * 주의 * *:

은 앞의 몇 가지 방법의 개선 으로 원형 대상 의 속성 과 방법 만 계승 하고 자신의 속성 과 방법 은 계승 하지 않 는 다

.

uber 를 통 해 부모 대상 을 편리 하 게 방문 할 수 있다

원형 속성 복사
실례:

function extend2(Child,Parent) {
var p = Parent.prototype;
var c = Child.prototype;
for (var i in p) {
c[i] = p[i];
}
c.uber = p;
}

분류: 구조 기 모드 를 바탕 으로 속성 복사 모드 를 바탕 으로 원형 체인 을 사 용 했 습 니 다.
* * 주의 * *:

부모 원형 의 모든 속성 을 하위 원형 에 복사

새로운 대상 이 나 오지 않 아 도 된다

더 짧 은 원형 체인

모든 속성 복사 (얕 은 복사)
실례:

function extendCopy(p) {
var c = {};
for (var i in p) {
c[i] = p[i];
}
c.uber = p;
return c;
}

분류: 대상 기반 모드 속성 복사
* * 주의 * *:

간단 하 다

원형 을 사용 하지 않 아 도 된다

딥 카피
실례:

function deepCopy(p, c) {
c = c || {};
for (var i in p) {
if (p.hasOwnProperty(i)) {
if (typeof p[i] === 'object') {
c[i] = Array.isArray(p[i]) ? [] : {};
deepCopy(p[i], c[i]);
} else {
c[i] = p[i];
}
}
}
return c;
}

분류: 대상 기반 모드 속성 복사
* * 주의 * *:

간단 하 다

원형 을 사용 하지 않 아 도 된다

대상 과 배열 도 복사

원형 상속 법
실례:

function object(o)
{
function F() {}
F.prototype = o;
return new F();
}

분류: 대상 기반 모델 사용 원형 체인 * * 주의 * *:

대상 간 에 직접 상속 관 계 를 구축한다

확장 및 증강 모드
실례:

function objectPlus(o, stuff) {
var n;
function F() {}
F.prototype = o;
n = new F();
n.uber = o;
for (var i in stuff) {
n[i] = stuff[i];
}
return n;
}

분류: 대상 기반 작업 모드 원형 체인 속성 복사 모드 사용 * * 주의 * *

이 방법 은 실제 원형 계승 법 과 속성 복사 법의 혼합 응용

이다.

계승 과 확장 을 동시에 실현

다 중 상속 법

function multi() {
var n = {}, stuff,j = 0,
len = arguments.length;
for (j = 0; j

분류: 대상 기반 작업 모드 속성 복사 모드 * * 주의 * * *

혼합 삽입 식 의 계승 실현

부모 대상 이 나타 나 는 순서에 따라 속성 전 복사 방법

을 집행 한다.
기생 식 계승
실례:

function parasite(victim) {
var that = object(victim);
that.more = 1;
return that;
}

분류: 대상 기반 작업 모드 에서 원형 체인 사용 * * 주의 * *

이 방법 은 구조 함수 와 유사 한 함 수 를 통 해 대상 을 만 듭 니 다

이 함 수 는 대상 의 복사 본 을 실행 하고 확장 을 한 다음 대상 으로 돌아 갈 수 있 습 니 다

차용 구조 함수:
실례:

function Child() {
Parent.apply(this,
arguments);
}

분류: 구조 함수 기반 모드
* * 주의 * *:

자신의 속성 만 계승

방법 과 결합 하여 사용 하기에 편리 한 원형 계승

하위 대상 이 특정한 대상 의 구체 적 인 속성 을 계승 하 는 데 편리 하 다

속성 복사
실례:

function Child() {
Parent.apply(this,arguments);
}
extend2(Child,Parent);

분류: 구조 기 모드 를 바탕 으로 원형 체인 속성 복사 사용 * * 주의 * *

구조 기와 원형 속성 복사 의 결합

부모 대상 구조 기 를 중복 호출 하지 않 은 상태 에서 자신의 속성 과 원형 속성 을 동시에 계승 할 수 있 습 니 다