Javascript private속성

BooKi·2022년 3월 5일

JavaScript

Javascript

목록 보기

43/46

⭐Javascript private속성

📕복습

클래스를 복습하면서 private에 대해 알아보자

<script>
  class Square{
    constructor(r) {
      this.r = r
    }
    getArea () {
      return this.r * this.r
    }
    getPerimeter () {
      return 4 * this.r
    }
  }

  const square = new Square(10)
  console.log(square.getArea())
  console.log(square.getPerimeter())
</script>

정사각형의 넓이와 네 변의 합을 구하는 클래스를 만들었다

📗private속성을 사용하는 이유

예를 들어서 우리가 이 클래스를 다른 사람과 공유할 때 문제가 생길 수 있다

다른 사람이 매개변수로 음수 값을 넣으면 네 변의 합은 음수가 나오는 일이 생긴다

물론 앞에서 배운 throw를 활용하여서 매개변수로 음수가 들어왔을 때

에러를 발생시키면 해결된다

그러나 선언을 한 후에 속성을 직접적으로 변경하는 경우도 존재한다

const square = new Square(10)
square.r = -10

이런식으로 직접적으로 변경하는 경우를 방지하기 위해 개발자들이 암묵적으로

속성이름 앞에 _가있으면 이 속성은 건들이지 말라 는 소리이다

그러나 이 룰을 모르는 개발자가 있다면 문제가 발생될 것이다

그래서 아예 접근하지 못하도록 만든 것이 private 속성이다

📘private 속성

클래스 내부에서만 접근 가능한 속성이다

클래스 내부에서 #매개변수 이렇게 선언을 해주어야 한다

<script>
  class Square{
  	#r
    constructor(r) {
      this.#r = r
    }
    getArea () {
      return this.#r * this.#r
    }
    getPerimeter () {
      return 4 * this.#r
    }
  }

  const square = new Square(10)
  console.log(square.getArea())
  console.log(square.getPerimeter())
</script>

이렇게 하면 클래스 외부에서 r에 접근하려고 하면 오류를 발생시킨다

📙getter와 setter

만약 클래스 외부에서 r에 접근하고 싶다면 어떻게 해야할까

그땐 getter와 setter를 사용해야 한다

클래스 내부에서 함수를 만들어 주는 것이다

<script>
  class Square{
    #r
    constructor(r) {
      if (r < 0) { throw '길이가 음수입니다' }
      this.#r = r
    }
    getArea () {
      return this.#r * this.#r
    }
    getPerimeter () {
      return 4 * this.#r
    }

    setR (r) {
      if (r < 0) { throw '길이가 음수입니다' }
      this.#r = r
    }
    getR () {
      return this.#r
    }
  }

  const square = new Square(10)
  console.log(square.getArea()) //100
  console.log(square.getPerimeter()) //40

  console.log(square.getR()) //10
  square.setR(20)
  console.log(square.getR()) //20
</script>

이렇게 작성하면 결과로 100 40 10 20 이 나온다

이렇게 하면 getR(),setR() 함수를 사용해야 하니 귀찮다는 말이 나왔다

그래서 그것을 해결하기 위해 다음과 같은 방법이 사용되고있다

<script>
  class Square{
    #r
    constructor(r) {
      if (r < 0) { throw '길이가 음수입니다' }
      this.#r = r
    }
    getArea () {
      return this.#r * this.#r
    }
    getPerimeter () {
      return 4 * this.#r
    }

    set r (r) {
      if (r < 0) { throw '길이가 음수입니다' }
      this.#r = r
    }
    get r () {
      return this.#r
    }
  }

  const square = new Square(10)
  console.log(square.getArea())
  console.log(square.getPerimeter())

  console.log(square.r)
  square.r = 20
  console.log(square.r)
</script>