JS 클래스 형태

class Lotto {
  #number;

  constructor(number) {
    this.#number = number;
  }

  getNumber() {
    return this.#number;
  }
}

 

다음과 같은 Lotto 클래스의 객체가 있다.

#number는 private 형태라서 클래스 내부에서만 접근 가능하고,

외부에서는 getNumber()를 이용해야지 #number에 접근할 수 있다.

 

다음과 같은 로또를 받는다고 가정하자.

const lotto = new Lotto([1,2,3,4,5,6]);

 

그럼 객체의 형태는 어떻게 될까?

Lotto {
  #number: [1,2,3,4,5,6]
}

 

이렇게 객체 배열의 형태로 만들어진다.

Lotto 객체 안에 key가 #number이고, value가 배열인 형태가 생성된다.

console.log(lotto);

 

lotto 변수를 출력하면 어떻게 보일까?

외부에서는 private 필드에 있는 #number에 직접 접근을 하지 못한다.

그래서 출력은,

Lotto {}

 

로 보일 것이다.

실제 값을 확인하기 위해서는 getNumbers()를 이용해야 한다.

lotto.getNumbers();

// [1,2,3,4,5,6]

 

getNumbers()를 통해야 Lotto 객체 안에 있는 #number에 접근할 수 있다.

그럼 여러 개를 확인해 보자.

const lottos = getLottos(3);

 

3개의 Lotto class 객체를 만든다고 가정한다.

그럼 개념적인 구조는

[
  Lotto { #number: [1,2,3,4,5,6] },
  Lotto { #number: [7,8,9,10,11,12] },
  Lotto { #number: [13,14,15,24,25,26] }
]

 

이 나온다.

console.log(lottos);

 

lottos를 출력하면 결과는 어떻게 나올까?

앞서 외부에서 #number에 접근하지 못한다.

그럼 Lotto 객체만 출력되고, #number는 출력되지 못할 것이다.

[Lotto {}, Lotto {}, Lotto{}]

 

#number에 접근하기 위해서는 getNumbers()를 이용해야 한다.

lottso[0].getNumbers();
// [1,2,3,4,5,6]

 

lottos 배열의 각 인덱스에 getNumbers() 접근하면 #number가 나온다.

왜 Lotto class를 만들고 객체를 지정해 두는 것일까?

함수형으로 만들었다고 가정을 해보자.

function Lotto() {
  const lotto = {
    number1: [1,2,3,4,5,6],
    number2: [5,3,4,2,6,7],
  }
}

 

lotto 객체 값을 외부에서 쉽게 변경할 수 있다.

lotto.number1 = [11,12,13,14,15,16];

 

class를 만들고 private 설정을 하면 외부에서 직접 값을 바꿀 수 없게 된다.

외부에서 쉽게 바꿀 수 없게 만들기 위해 class를 사용한다고 이해가 된다.