타입스크립트에서의 class개념과 접근제어, getter/setter에 대해서 알아보자



Class

class Person {
    // 자바스크립트와는 조금 다른 class 사용법
    // 이 공간은 필드라고 불리며, 속성을 아래와 같이 키:타입으로 데이터타입 정의
    // 여기에 적은 속성은 public으로 사용가능
    name: string;
    age: number;
    readonly location: string = 'Korea';
    // 앞에 readonly를 붙여주면 고정된 읽기전용 값이 된다

    // 생성자 - 초기화 담당
    constructor(name: string, age: number) {
        this.name = name
        this.age = age
    }
}

const p = new Person('Na', 99)
// p가 인스턴스, Person은 클래스

console.log(p)



접근제어자

public / private / protected

public

해당 class 내부 호출/사용 : O

파생 class 내부 호출/사용 : O

외부에서 인스턴스 생성 후 인스턴스로 호출/사용 : O

⇒ 모두 접근 가능

protected

해당 class 내부 호출/사용 : O

파생 class 내부 호출/사용 : O

외부에서 인스턴스 생성 후 인스턴스로 호출/사용 : X

private

해당 class 내부 호출/사용 : O

파생 class 내부 호출/사용 : X

외부에서 인스턴스 생성 후 인스턴스로 호출/사용 : X




Getter / Setter

접근제어자로 인해 바로 접근이 불가능한 속성들에 접근할 수 있도록 하는 제어자
접근제어자+getter/setter 조합을 이용하면 속성 조작을 좀 더 안전하게 할 수 있다.

// getter / setter
// => 필드에 접근할 수 있는 권한을 가진 제어자
// getter : O / setter : X => 이렇게 하면 해당 속성은 자동으로 읽기 전용으로 설정
// setter 매개변수의 타입 지정X => getter의 반환 타입에서 추론
// + private 속성은 .연산자로 접근할 수 없다.
class Person {
    name: string;
    private _age: number;
    readonly location: string = 'Korea';

    constructor(name: string, age: number) {
        this.name = name
        this._age = age
    }

// private속성인 _age에 접근하는 방법을 남겨두기 위해 getter함수 생성
    get age() {
        if (this._age === 0) { // 이런식으로 조건을 달 수 있음
            return '설정되지 않았습니다.'
        }

        return this._age
    }

    set age(age) {
        if (typeof age === 'number') { // 이런식으로 조건을 달 수 있음
            this._age = age
        }

        this._age = 0
    }
}

const p = new Person('Na', 99)
console.log(p.name)
console.log(p._age) // private이라 접근 불가능하다고 error발생
console.log(p.age) // getter함수를 이용했기 때문에 가능

const p2 = new Person('Who', '40')
// 1차적으로 타입이 number가 아니라는 error와 함께 막힘,
// 2차적으로 혹시 값이 들어가게 되더라도 조건문에 의해 0으로 설정됨
profile
⛅🛩️ 먼 길을 돌아서 온 프론트엔드 개발자 ✈️⛅

0개의 댓글