본문 바로가기

WEB의 속삭임/Client단의 외침

[JavaScript][객체][프로토타입 체인] 자바스크립트의 상속!


* JavaScript의 상속을 프로토타입 체인이라고 한다. 이것은 객체가 인스턴스 하는 시점에 맺어 지고, 이후 변경은 안된다.

** 아래 예제 소스로 이해 하자.

var Animal = function(){}


Animal.prototype = { 

walk : function() { document.writeln('쫑~쫑~');}

}; 


var SuperAnimal = function(){}

SuperAnimal .prototype = {

walk : function(){ document.writeln('다다다다닷!'); }

};


var Dog = function(){};

Dog.prototype = new Animal();

var d1 = new Dog();

d1.walk(); // 쫑~쫑~



Dog.prototype = new SuperAnimal(); 

var d2 = new Dog();

d2.walk();// 다다다다닷!

d1.walk(); //쫑~쫑~






* 클래스 기반 객체지향 상속 법 : JavaScript로 클래스기반상속 처럼 해보자~

/**

* 현재의 인스턴스, 부모 클래스, 인수배열

**/

function initializeBase( derive, base, baseArgs ){

base.apply( derive, baseArgs );

for(prop in base.prototype){

var proto = derive.constructor.prototype;

if( !proto[prop] ){

proto[prop] = base.prototype[prop];

}

}

}


* 예제문

/**

* 현재의 인스턴스, 부모 클래스, 인수배열

**/

function initializeBase( derive, base, baseArgs ){

base.apply( derive, baseArgs );

for(prop in base.prototype){

var proto = derive.constructor.prototype;

if( !proto[prop] ){

proto[prop] = base.prototype[prop];

}

}

}

var Member = function(firstName, lastName){

this.firstName = firstName;

this.lastName = lastName;

};

Member.prototype.getName = function(){

return this.lastName + ' ' + this.firstName;

};

var SpecialMember = function(firstName, lastName, role){

initializeBase( this, Member, [firstName, lastName] );

this.role = role;

};

SpecialMember.prototype.isAdministrator = function(){

return (this.role == 'Administrator');

};

var mem = new SpecialMember( '요시히로', '야마다', 'Administrator' );

document.writeln('Name : ' + mem.getName());

document.writeln('관리자 : ' + mem.isAdministrator());