javascript, jQuery & Node.js
class extends 클래스 상속, 자바스크립트 상속 - 객체지향 자바스크립트 07
yy_dd2
2022. 4. 25. 07:25
반응형
1. 상속이 무엇인가
상속은 이미 정의된 class에 다른 기능을 추가하여 확장시켜 사용 할 때 자식class를 만들어서 기존의 부모 클래스가 가지고 있는 기능을 상속받아 사용이 가능하면서
새로운 기능을 추가할 수 있는 기능이다.
2. 상속이 없으면 불편한점
부모 클래스가 공유되어있는 라이브러리거나 내가 작성한 코드가 아닐때 또는 내가 작성한 코드라 해도 오류나 비효율이 생길 수 있을때
빈도가 적은 함수를 부모 클래스 안에서 생성하여 사용하는 것은 비효율적이기 때문에
새로운 자식클래스를 정의하여 상속받아서 사용한다
3. 상속 할 때 extends를 사용하게 된다 이 상속 받는 자식 클래스는 어떡해 구현하는가?
클래스 자식클래스이름 extends 부모클래스이름{}으로 안에 함수를 정의한다
상속받은 자식클래스는 부모클래스 없이 함수를 사용할 수 있다.
부모 클래스가 변경되면 자식 클래스도 영향을 받는다
class Person{
constructor(name, first, second){
this.name = name;
this.first = first;
this.second = second;
console.log('constructor');
}
sum (){
return 'class Person prototype : '+ (this.first+this.second);
}
}
// 상속
// 새로운 메소드가 필요할때 1. 기존 클래스 안에 함수를 정의한다 2. 클래스를 새로 만들어서 새로 추가한다
// 내가 만든 class가 아닌 다른 사람이 짜둔 코드라던가 추가로 코드가 들어갈때
// class PersonPlus {
// constructor(name, first, second){
// this.name = name;
// this.first = first;
// this.second = second;
// console.log('constructor');
// }
// sum(){
// return 'class prototype : '+ (this.first+this.second);
// }
// avg(){
// return (this.first+this.second)/2;
// }
// }
// Person에 사용된 중복을 제거하기 위한 상속 사용하기
class PersonPlus extends Person {
avg(){
return 'class PersonPlus extends Person prototype : '+ (this.first+this.second)/2;
}
}
// PersonPlus지만 상속된 Person의 내용을 변경하면 같이 변경이된다
var kim = new PersonPlus('kim', 10, 20);
console.log("kim.sum()", kim.sum());
console.log("kim.avg()", kim.avg());
생활코딩은 일반인들에게 프로그래밍을 알려주는 무료 온라인, 오프라인 수업이다 이전부터 알고 있는 곳이고
필요에 따라 홈페이지에 들어가서 한두개씩 듣곤 했는데 Node.js 책을 읽기 전에 자바스크립트 객체에 관련해서 복습 겸 더 정확히 알 필요가 있을 듯 해서 듣고있다 아직 5개 정도 더 남았다
반응형