JavaScript 상속 사용 분석_js 객체 지향

JavaScript 상속에 대해 자세히 알아보기 전에 먼저 다음 개념을 이해하세요.
상위 클래스: 상속된 클래스
하위 클래스: 상속된 클래스
슈퍼 클래스: 즉, 상위 클래스
추상 클래스: A 일반적으로 인스턴스화에 사용되지 않는 클래스입니다.
기본 클래스: 다른 클래스에서 상속할 수 있는 클래스
파생 클래스: 기본 클래스에서 상속되는 클래스

자바스크립트 객체 상속에는 일반적으로 다음과 같은 5가지 방법이 있습니다.
1. 객체 가장
2. call() 메서드
3.apply() 메서드
4.프로토타입 체인
5. 혼합 방법

A. 객체 가장
소위 객체 가장은 상속의 목적을 달성하기 위해 새로운 클래스가 이전 클래스를 가장하는 것(이전 클래스는 생성자 메서드를 사용해야 함)입니다
. 예 .1

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

function people(name,sex) ,age){ //생성자 메서드 사용
this.name=name;
this.age=age
this.say=function(){
alert(" 내 이름은 "입니다.
};

this.doing=function(){
alert("나는 말하고 있습니다")
}
var Marry=new people("Marry","Woman","23")
Marry.say()
Marry.doing()

function white_people(이름, 성별, 나이){
this.inherit=people;
this.inherit(이름, 성별, 나이)
delete this.inherit; function(){
alert("저는 유럽에 있습니다")
}
}
var Tom=new white_people("Tom","man","21"); Tom.say( );
Tom.area();
alert(Tom.age)


위의 예에서는 people이 white_people의 기본 클래스로 사용되었습니다. 형식은
this.inherit=people이며, 상속을 달성하기 위해 개체 가장에 사용됩니다. //
this.inherit(name,sex,age) //Inherit
delete this.inherit; /상속 삭제

상속 클래스의 관련 속성과 메서드를 덮어쓰지 않으려면 모든 새 속성과 새 메서드를 삭제해야 합니다.
또한 개체 가장은 다중 상속을 지원합니다. 2




코드 복사

코드는 다음과 같습니다. 기능 작업자(급여,작업){ this.pay=pay; this.work=work; }

function city_worker(name,sex,age,pay,work){

this.inherit=people; >this.inherit(이름, 성별, 나이);
delete this.inherit;

this.inherit=worker;
this.inherit(pay,work); 상속;
}

var Jerry=new city_worker("Jerry","man","21","$1000","coder")
Jerry.say(); >alert(Jerry.work) ;


객체 가장에는 단점이 있습니다. 다중 상속 메커니즘이 구현될 때 기본 클래스가 동일한 속성이나 메서드를 갖는 경우 후속 클래스에서 상속됩니다. .

B.call () 메소드
는 캡슐화된 객체를 가장한 함수일 뿐입니다. 이런 식으로 더 이상 "전통적인" 세 문장을 작성할 필요가 없지만 다음과 같이 대체합니다. 문장:
Base class.call(객체, 매개변수 목록)
eg.1

코드 복사


코드는 다음과 같습니다. 다음과 같습니다:

function farmer(name,sex,age,pay,work){ people.call(this,name,sex,age) worker.call(this) ,pay,work) var Nicholas=new farmer("Nicholas","man","27","$3000","irrigator") Nicholas.say( ); alert(Nicholas.pay);

마찬가지로 call()에도 동일한 이름의 속성과 메서드에 작은 문제가 있습니다. method
call()과 동일합니다. apply()도 객체 가장을 위한 래퍼 함수입니다. 형식은 다음과 같습니다.
base class.apply(object, paramator array)
eg.1




코드 복사

코드는 다음과 같습니다.


function white_collar(이름, 성별, 나이, 급여, 직장 ){
people.apply(this,new Array(이름,성별,나이))
작업자.apply(this,[pay,work])

var Jiessie =new white_collar("Jiessie","woman","26","$2500","editor") Jiessie.say() alert(Jiessie.work); 마찬가지로 apply()도 같은 이름의 속성과 메소드에 작은 문제가 있습니다. D. 프로토타입 체인

위의 세 가지 메소드는 모두 그에 따라 생성자의 형태로 상속을 사용합니다. 프로토타입 함수 형태의 상속이기도 합니다:

eg.1




코드 복사


코드는 다음과 같습니다. :

function blue_collar(){
}
blue_collar.prototype.name="Jean"
blue_collar.prototype.age="33"
blue_collar. 프로토타입.say=function(){
alert("내 이름은 " this.name);

function city_blue_collar(){ } city_blue_collar.prototype= new blue_collar(); var jj=new city_blue_collar jj.say();
프로토타입 체인에는 매개변수를 전달할 수 없다는 단점도 있습니다. 또한

E.Mixed 메서드
는 생성자 메서드를 사용하기 때문에 다중 상속을 지원하지 않습니다. 클래스의 속성을 작성하려면 속성 상속을 위해 call() 또는 apply()를 사용
프로토타입 메소드를 사용하여 메소드 작성, 메소드 상속을 위해 프로토타입 체인 사용
eg.1

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

function beauty(이름,나이){
this.name =name;
this.age=age;
}
beauty.prototype.say=function(){
alert("어린 소녀의 이름" this.name)

function china_beauty(이름,나이,지역){
beauty.call(this,name,age);
this.area=area;
}
china_beauty.prototype=new beauty();
china_beauty.prototype.from= function(){
alert("나는 출신입니다" this.area)
}; var diaochan=new china_beauty(" Diao Chan","16","Lintao");
diaochan.say();
diaochan.from();
alert(diaochan.age);