티스토리 뷰
발생일: 2015.05.12
키워드: class, 클래스, class expression, 클래스 선언, 클래스 표현식
내용:
ES6에서는 `class` 키워드로 프로토타입 기반의 상속을 간편하게 구현할 수 있다.
아래 코드를 보면 이해할 수 있다.
// 클래스를 선언할 수 있다.
class Shape {
// 기본적으로 클래스의 body는 strict mode 로 실행된다.
// 생성자
constructor(width, height) {
this.width = width;
this.height = height;
}
// 멤버 메서드
getArea() {
return 0;
}
// 스태틱 메서드
static getType() {
return 'Shape';
}
// 클래스 문법으로 스태틱 멤버를 정의할 수 없다.
}
// class 또한 실제로 함수이기 때문에,
// 함수 표현식(function expression)으로도 정의할 수 있다.
// 클래스 표현식(class expression)이라고도 한다.
var Shape = class { ... }
// 클래서 선언에는 호이스팅(hoisting)이 적용되지 않는다.
new Person();
class Person {} //-> Uncaught SyntaxError: Unexpected token class
// 클래스를 중복으로 선언한 경우, 문법 에러가 발생한다.
class Shape {}
class Shape {} //-> Uncaught SyntaxError: Identifier 'Shape' has already been declared
// `extends` 키워드로 상속할 수 있다.
class Rect extends Shape {
constructor(width, height) {
// 부모는 `super` 키워드로 참조할 수 있다.
super(width, height);
...
}
// 프로토타입 기반으로 동작하므로,
// 메서드명이 동일하다면 부모의 메서드를 덮어쓴다.
getArea() {
return this.width * this.height;
}
getType() {
// 멤버 메서드 내에서도 부모의 인스턴스를 참조할 수 있다.
return super.getType() + ':Rect';
}
}
반응형
댓글
공지사항