티스토리 뷰

자바스크립트에서 데코레이터 패턴을 공부하는데 자바스크립트에서 클래스 정의는 어떻게 되는지 몰라서 공부한걸 적어놓는다. 참조 : 3 ways to define a JavaScript class

  • 자바스크립트는 클래스라는 개념이 없다.
  • 자바스크립트에서 모든것은 객체이다.
  • 상속은 객체가 객체로 부터 받는다.

함수를 이용한 방법

자바스크립트 함수를 만든 다음에 new 키워드로 객체를 생성하면 된다. 함수를 이용해서 만든 객체의 속성과 메소드를 정의하기 위해서는 this 키워드를 사용한다.

객체 정의

1
2
3
4
5
6
function Espresso() {
    this.cost = 2500;
    this.getCost = function() {
        return this.cost;
    }
}
cs

객체 생성

1
2
let espresso = new Esspresso();
consol.log(espresso);
cs

객체 리터럴(literal)을 이용한 방법

리터럴은 자바스크립트에서 객체와 배열을 정의하는데 사용하는 방법이다. 함수를 이용한 방법처럼 객체 정의와 생성의 2단계를 거치지 않고 정의와 함께 바로 객체를 생성할 수 있다. 그렇기 때문에 리터럴로 정의 하면 인스턴스 생성 없이 바로 객체를 사용할 수 있다. 이런 객체를 싱글튼(singleton)이라 부른다. singleton은 하나의 객체가 하나의 인스턴스를 가지는걸 말한다.

1
2
3
4
5
6
7
8
9
10
11
12
let espresso = {};
let espresso = new Object();
 
let espresso = [];
let espresso = new Arrary();
 
let espresso = {
    cost: 2500;
    getCost: function() {
        return this.cost;
    }
};
cs

함수와 리터럴의 조합을 이용한 방법

앞서 얘기한 함수를 이용한 방법과 싱글튼과 조합한 방법이다.

1
2
3
4
5
6
let espresso = new function Espresso() {
    this.cost = 2500;
    this.getCost = function() {
        return this.cost;
    }
}
cs

좀 더 생각해볼것들

프로토타입에 대해 더 이해가 필요하다.