자바스크립트 기본 - 상속
상속 - https://opentutorials.org/course/743/6572
상속(inheritance)이란 원래객체가 가지고 있는 기능을 상속받는 객체가 사용할 수 있다는 뜻이다.
자바스크립트에서 상속의 사용법을 알 수 있는 예제이다.(->이렇게 사용하면 상속이되는구나 라고 이해하는 예제)
이예제는 부모객체와 자식객체의 기능이 같은 예제이다.
function Person(name){
this.name = name;
}
Person.prototype.name=null;
Person.prototype.introduce = function(){
return 'My name is '+this.name;
}
function Programmer(name){ //Programmer생성자를 만들었다.
this.name = name;
}
Programmer.prototype = new Person(); //Person이 객체가 되면서 Person이 가지고 있는 Person.prototype.name, Person.prototype.introduce을 포함하는 어떠한 객체가 만들어진다. 어떠한 객체는 Programmer.prototype에 담아진다.
상속이 이루어지는 곳이다.
var p1 = new Programmer('egoing'); //Programmer에 new를 붙여 객체로 만든다음 egoing을 인자로주었기 때문에 this.name=egoing이 된다. p1에는 this.name=egoing이라는 객체를 담는다.
document.write(p1.introduce()+"<br />");
예제는 자식객체가 부모객체의 기능을 물려받고 부모객체의 기능을 제외한 추가적인 기능을 가지는 방법이다.
function Person(name){
this.name = name;
}
Person.prototype.name=null;
Person.prototype.introduce = function(){
return 'My name is '+this.name;
}
function Programmer(name){
this.name = name;
}
Programmer.prototype = new Person(); //이부분에서 상속이 되어진다.
Programmer.prototype.coding = function(){ //Programmer(자식객체)에 coding을 추가하였다.
return "hello world";
}
function Designer(name){
this.name = name;
}
Designer.prototype = new Person(); //이부분에서 상속이 되어진다.
Designer.prototype.design = function(){ //Designer(자식객체)에 design을 추가하였다.
return "beautiful!";
}
var p1 = new Programmer('egoing');
document.write(p1.introduce()+"<br />");
document.write(p1.coding()+"<br />");
var p2 = new Designer('leezche');
document.write(p2.introduce()+"<br />");
document.write(p2.design()+"<br />");
Person부모객체에서 Programmer자식객체과 Designer자식객체에게 자신의 기능을 상속하여준다.
Person부모객체에서 prototype의 return값을 변경하면 자식객체의 값에도 영향을 미친다.
