반응형

TIF: Today I Failed

실패담입니다. 아직 해결하지 못한 문제입니다.




- 설명

내부 로직에서만 공유되어야하는 값의 경우, private 변수 선언을 통해 외부에서 접근할 수 없도록 해야합니다. 하지만, JavaScript 에서는 private 변수를 지원하지 않습니다. 따라서, 기괴한? 방법을 사용해 이를 우회해 구현해야 합니다.


- 시도

  1. _(언더바) 로 private 변수 구분 후, 난독화 처리(옛날 방식).
    효과: 난독화되면 해당 값이 무엇을 의미하는지 알 수 없으므로, 의도적인 사용을 방지할 수 있다.
    단점: 여전히 접근은 가능하다. 난독화 라이브러리와 babel 과의 호환문제로, ES6+ 에서는 사실상 사용이 불가하다.
           (참고: https://github.com/terser-js/terser/issues/237)

    class MyClass {
      constructor() {
        this._myPrivate = "private";
      }

      setValue(value) {
        this._myPrivate = value;
      }
    }

  2. scope 활용 & 메소드를 constructor 내부에 선언.
    효과: class 내부에서만 사용이 가능하다.
    단점: private 변수에 접근이 필요한 모든 메소드를 constructor 내부에 위치시켜야 하므로, constructor 가 길어진다.
           해당 클래스를 상속할 경우, 클래스의 메소드에 접근이 불가하다.

    class MyClass {
      constructor() {
        let myPrivate = "private";
       
        this.setValue = (value) => {
          myPrivate = value;
        };
      }
    }

  3. 내부 메소드 접근을 위한 자체 난독화 메소드 구현
    효과: class 를 상속하더라도 private 변수에 접근이 가능하다.
    단점: 더럽다. 코드를 오픈하면, 어떻게 private 변수에 접근하는지 추측이 어느정도 가능하다.

    class MyClass {
      constructor() {
        let myPrivate = "private";

        this.__private__ = {
          set: (key, value) => {
            if (key === "_") {
              myPrivate = value
            }
          },
        };
      }

      setValue(value) {
        this.__private__.set("_", value);
      }
    }

   

- 원하는 결과


class MyClass {
  constructor() {
    let myPrivate = "private";
  }

  setValue(value) {
    myPrivate = value;
  }
}


반응형

+ Recent posts