JavaScript 프로 토 타 입 체인 과 계승 작업 사례 총화
5363 단어 JavaScript원형 체인이어받다
1.자 바스 크 립 트 계승
JavaScript 계승 은 대상 과 대상 사이 에서 발생 하 는 것 이 고 원형 체인 은 계승 을 실현 하 는 주요 한 방법 이 라 고 할 수 있다.
1.1 원형 체인
원형 을 이용 하여 하나의 인용 유형 으로 하여 금 다른 인용 유형의 속성 과 방법 을 계승 하 게 합 니 다.
구조 함수 에 prototype(함수 마다 있 음)이 있 습 니 다.그의 원형 대상 을 가리 키 고 모든 원형 대상 에 도 하나의 constructor 속성 이 있 으 며 원 구조 함 수 를 가리 키 고 있 습 니 다.구조 함 수 를 통 해 만 든 새 대상 에는 직접 접근 할 수 없 는[proto]속성 이 있어 대상 도 구조 함수 의 원형 을 가리 키 게 합 니 다.이것 은 대상 도 원형 중의 방법 과 속성 을 얻 게 한다.
대상 의 속성 이나 방법 을 방문 할 때 대상 에 이 속성 이나 방법 이 없 으 면 이전 원형 대상 에서 이 속성 이나 방법 을 찾 습 니 다.찾 으 면 이 속성 을 되 돌려 주 고 없 으 면 위의 원형 에서 이 속성 을 계속 찾 습 니 다.
1.2 구조 함수 의 원형 체인 계승
function Father(name,age){
this.name=name;
this.age=age;
}
Father.prototype.eat=function(){ // eat
console.log(this.name+" ");
}
var f1=new Father(" ",20); // f1, [[proto]]
function Son(){
}
Son.prototype=f1; // prototype , ――
var s1=new Son(); //
s1.eat(); //
실행 결과:주의:
①
Son.prototype
Father 를 가리 킬 때 그 는 이미 아버지 유형의 Son 이다.②:
s1.eat();
s1 에는 이 방법 이 없습니다.이 방법 은 부모 유형의 원형 에서 s1 이 방문 할 때 현재 s1 에서 찾 습 니 다.없 으 면 그 가 가리 키 는 원형 에서 이 방법 을 찾 습 니 다.없 으 면 위의 원형 에서 계속 찾 습 니 다.이렇게 해서 원형 체인 이 형성 되 었 다.③:원형 체인 을 통 해 계승 을 실현 했다.
약자:
var f1=new Father;
var Son.prototype=f1
// :
var Son.prototypr=new Father(); // ,
1.3 기본 정상 프로 토 타 입
기본 최상 위 프로 토 타 입:
모든 유형 이 어떤 유형 을 계승 하 는 지 밝 히 지 않 았 을 때 Object 형식 을 기본적으로 계승 합 니 다.
object 에 도 prototype 이 그의 object 원형 을 가리 키 고 object 에 도
[[proto]]
가 있 습 니 다.다만 그 가 가리 키 는 것 은 null 입 니 다.무시 할 수 있다.object 의 많은 방법 은 object 의 원형 에 존재 합 니 다.
원형 체인 에서 현재 위치 에서 원형 체인 의 맨 위 위치 까지 계속 위로 접근 합 니 다.
1.4 테스트 데이터
type:of 측정 데이터 의 유형 은 기본 형식 데이터 만 테스트 하 는 것 이 좋 습 니 다.기본 형식 을 제외 하고 모두 object 로 돌아 가 야 합 니 다.
console.log(typeof 123) //number
console.log(typeof "ccsa ") //string
intnaceof 테스트 대상 은 부모 대상 에 속 하지 않 는 유형 입 니 다.
function Father(name){
}
var f1=new Father();
console.log(f1 instanceof Father); //true
실행 결과:isPrototypeOf( )
원형 대상 에 속 하 는 방법 으로 이 대상 이 이 원형 체인 에 있 는 지 판단 하고 사용한다. .prototype.isPrototypeOf( )
function Father(){
}
function Son(){
}
Son.prototype=new Father;
var s1=new son();
console.log(Father.prototype.isPrototypeOf(s1)); //true
console.log(Object.prototype.isPrototypeOf(s1)); //true
1.5 차출차용:차용 구조 함수 호출 사칭 계승,차용 실현 의 계승 은 진정한 계승 이 아니 라 구조 함수 중의 속성 이나 방법 을 차용 할 뿐이다.
apply,call。
function Fn(name,age){
this.name=name;
this.age=20;
}
function Son(name,age,sex){
Fn.call(this,name,age) // Fn;
this.sex=sex;
};
var s1=new Son(" ",20," ");
console.log(s1);
메모:차출 단점:콜 은 계승 을 사칭 하 는 것 이지 진정한 계승 이 아니 기 때문에 원 구조 함수 의 원형 중의 속성 이나 방법 에 접근 할 수 없습니다.
1.6 그룹 상속
조합 구조 함수 의 차출 계승 과 원형 의 계승 장점:
function Fn(name,age){
this.name=name; //
this.age=age;
if((typeof Fn.prototype.eat)!="funciton"){ // ,
Fn.prototype.eat=function(){ //
console.log(this.name+" ");
}
}
}
function Son(name,age,sex){ //
Fn.call(this,name,age) // Fn()
this.sex=sex;
};
Son.prototype=new Fn(); //Son.prototype , , eat ,
var s1=new Son(" ",20," "); // , call Fn , s1 eat
callconsole.log(s1); // call
s1.eat();
주의:Son.prototype=new Fn();
이 문 구 는 Son 이 아버지 유형 Fn 을 계승 하 는 것 을 실현 했다.Son 은 부모 유형 이 만 든 대상 을 가리 키 고 부모 유형의 대상 은 자신의 속성 을 가지 고 있 으 며 하위 유형의 원형 이 되 었 습 니 다.그러면 그 중의 속성 은 공유 하 는 것 이 되 지 않 습 니까?그러나 앞 에Fn.call( )
도 사용 되 었 다.이 문 구 는 부모 류 구조 함수 속성 을 빌려 하위 유형의 원형 을 덮어 쓰 는 속성 에 해당 한다.자 바스 크 립 트 관련 내용 에 관심 이 있 는 독자 들 은 본 사이트 의 주 제 를 볼 수 있 습 니 다.,,,,,javascript 대상 입문 강좌,JavaScript 오류 및 디 버 깅 기술 요약,JavaScript 데이터 구조 와 알고리즘 기술 총화과JavaScript 스 트 리밍 알고리즘 및 기술 총화.
본 고 에서 말 한 것 이 여러분 의 자 바스 크 립 트 프로 그래 밍 에 도움 이 되 기 를 바 랍 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
기초 정리 - 1문자 (String) 숫자 (Number) 불린 (Boolean) null undefined 심볼 (Symbol) 큰정수 (BigInt) 따옴표로 묶어 있어야 함 Not-A-Number - 숫자 데이터 / 숫자로 표...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.