
Published 2020. 12. 9. 20:30
반응형
class
객체를 만드는 공장
console.group("---------------------");
function Players(name, firstSc, secondSc) {
this.name = name;
this.firstSc = firstSc;
this.secondSc = secondSc;
}
Players.prototype.sum = function () {
return "His all score is " + (this.firstSc + this.secondSc);
};
let jio = new Players("jio", 10, 20);
let lee = new Players("lee", 10, 20);
console.log(jio.sum());
console.groupEnd("End");
console.group("---------------------");
class Player {
constructor(name, firstSc, secondSc) {
this.name = name;
this.firstSc = firstSc;
this.secondSc = secondSc;
}
sum() {
return "His all score is " + (this.firstSc + this.secondSc) + " on class";
}
}
let newLee = new Player("Mr.Lee", 100, 200);
console.log(newLee.sum());
위는 함수로 표현한 것이고, 밑에는 클래스로 표현한 것으로 결과는 같다
상속 (inheritance)
class Player {
constructor(name, firstSc, secondSc) {
this.name = name;
this.firstSc = firstSc;
this.secondSc = secondSc;
}
sum() {
return "His all score is " + (this.firstSc + this.secondSc) + " on class";
}
}
class newPlayer extends Player {
avg() {
return (this.firstSc + this.secondSc) / 2;
}
}
let newLee = new newPlayer("newLee", 100, 200);
console.log(newLee.avg());
class 안에서는 function을 쓰지 않고, constructor 함수를 쓴다
extends 로 기존함수를 상속받는다
상속으로 위에 함수를 공유받는다
상속을 받는 것은 sub class가 super class의 상속을 받고,
object 기능을 하는 것이다
상속의 필요 이유
상속이 없으면 newPlayer 함수는 Player의 기능을 다시 적어줘야 한다
중복이 되고, 실행의 처리량도 늘어난다
super
일부분에 있어서 부모가 있는 기능은 그대로 쓰고, 내가 가지고 있는 기능을 추가하여 쓸때 사용
class Player {
constructor(name, firstSc, secondSc) {
this.name = name;
this.firstSc = firstSc;
this.secondSc = secondSc;
}
sum() {
return "His all score is " + (this.firstSc + this.secondSc) + " on class";
}
}
class newPlayer extends Player {
constructor(name, first, second, third) {
super(name, first, second);
this.third = third;
}
sum() {
return super.sum() + this.third;
}
avg() {
return (this.firstSc + this.secondSc) / 2;
}
}
let newLee = new newPlayer("newLee", 100, 200, 300);
console.log(newLee.sum());
console.log(newLee.avg());
생성자에 있어서 인자, 함수 기능 등 일부의 그대로 가져오고 일부만 추가하고 싶을 때
super를 쓰면 된다.
인자와 메소드를 super를 통해 그대로 가져올 수 있다.
1. super()는 생성자를 불러오는 것이다
2. ()없이 그냥 super 이면 부모 클래스 자체를 말한다.
반응형
'Backend 언어 및 프레임워크' 카테고리의 다른 글
JS) 객체지향-5 constructor (0) | 2020.12.09 |
---|---|
JS) 객체지향-4 proto link(객체 상속), call vs bind (0) | 2020.12.09 |
JS) 객체지향-2 prototype (0) | 2020.12.09 |
JS) 객체지향-1 this, 생산자 생성(new), 생산자 함수 (0) | 2020.12.09 |
shortcut circuit (0) | 2020.12.08 |