728x90
TypeScript의 private 키워드는 클래스 내부에서만 접근할 수 있도록 멤버의 접근 범위를 제한하는 데 사용된다.
객체지향 프로그래밍의 캡슐화 개념으로 외부에서 직접 변경하거나 접근해서는 안되는 속성이나 메서드를 보호한다.
해당 클래스에서만 접근이 가능하고, 상속된 클래스나 인스턴스에서는 접근 불가하다.
그런데, private 키워드는 TypeScript에서만 제공되기 때문에 불안전하다고 생각한다. js에서는 동작하지 않고 오로지 ts에서만 동작하기 때문이다.
그런데 ts 파일이 컴파일될 때 js로 변환되는 데, js에서는 더이상 private 속성은 없는 것이다. 이 부분 때문에 js에서는 private 처럼 코드를 작성했지만, 실제로는 private처럼 동작하지 않는다.
js에서도 런타임 보호가 필요할 때에는 private 대신 #을 붙이면 된다. 아래 예제에서 다함께 살펴보겠다.
class Person {
private name: string;
constructor(name: string) {
this.name = name;
}
greet() {
console.log(`Hello, my name is ${this.name}`);
}
}
const john = new Person('John');
john.greet(); // ✅ 정상 출력: "Hello, my name is John"
console.log(john.name); // ❌ 오류
상속일 때 private
class Animal {
private secret: string = 'This is private';
getSecret() {
return this.secret;
}
}
class Dog extends Animal {
bark() {
// return this.secret; // ❌ 오류! private은 상속 클래스에서도 접근 불가
}
}
const d = new Dog();
console.log(d.getSecret()); // ✅ 부모 클래스의 공개된 메서드를 통해 간접 접근
js(런타임 보호가 필요할 때) 사용법
class RealPrivate {
#hidden: string = 'secret';
show() {
console.log(this.#hidden);
}
}
const rp = new RealPrivate();
rp.show(); // ✅ 출력: 'secret'
console.log(rp.#hidden); // ❌ 문법 오류 (런타임에서도 막힘)
private 사용 장점
- 캡슐화: 내부 상태를 외부로부터 보호
- 외부에서 의도하지 않게 접근•변경하지 못하기 때문에 예상치 못한 버그 발생 감소
- 외부에 보여지는 인터페이스가 명확해짐
private 키워드와 더불어 getter/setter, readonly 등 함께 사용하면 개발 시간 단축(코드를 전체 다 확인하지 않아도 특성 확인 가능) 및 오류가 줄어들 것이다.
728x90
'TECH' 카테고리의 다른 글
| var, let, const의 차이점 (3) | 2025.06.19 |
|---|---|
| 브라우저 저장소와 position (0) | 2025.06.18 |
| 스켈레톤 UI와 Box Model 구성요소 (0) | 2025.06.16 |
| SSR / CSR / SSG / ISR 🖥️ (2) | 2025.06.14 |
| Vue / React / Angular 🛜 (6) | 2025.06.13 |