TypeScript - 접근자

안녕하세요, 야심찬 프로그래머 여러분! 오늘 우리는 TypeScript 접근자의 fascineting 세계로 창을 열어보겠습니다. 프로그래밍에 처음 도전하는 분이라면 걱정하지 마세요 - 저는 이 주제를 단계별로 안내해드릴 것입니다. 수년간 수많은 학생들을 가르쳐온 경험을 바탕으로 말이죠. 그럼 당신의 좋아하는 음료를 한 잔 챙기고, 시작해보겠습니다!

TypeScript - Accessors

접근자는 무엇인가요?

TypeScript 접근자에 대해 구체적으로 다루기 전에, 접근자가 일반적으로 무엇인지 이해해보겠습니다. 당신이 보물 상자(이는 우리의 객체)를 가지고 있고, 그 안에 있는 보물(객체의 프로퍼티)에 대해 어떻게 사람들이 상호작용하려고 하는지 상상해보세요. 접근자는 이러한 보물을 통제된 방식으로 가져오거나 설정할 수 있게 해주는 마법의 열쇠입니다.

TypeScript에서는 두 가지 유형의 접근자를 가집니다:

Getters: 이는 우리가 프로퍼티의 값을检索할 수 있게 도와줍니다.
Setters: 이는 우리가 프로퍼티의 값을 설정할 수 있게 합니다.

이제 이 두 가지 접근자를 자세히 탐구해보겠습니다.

TypeScript에서 Getters

Getters는 무엇인가요?

Getter는 객체의 프로퍼티에 접근할 수 있게 해주는 특별한 종류의 메서드입니다. 마치 개인 비서가 정보를 가져다주는 것처럼 생각해보세요.

Getters를 어떻게 정의하나요?

간단한 예제를 보겠습니다:

class Person {
private _name: string;

constructor(name: string) {
this._name = name;
}

get name(): string {
console.log("이름을 가져오는 중");
return this._name;
}
}

let person = new Person("Alice");
console.log(person.name); // 출력: 이름을 가져오는 중 \n Alice

이 예제에서:

우리는 _name이라는 private 프로퍼티를 가진 Person 클래스를 가집니다.
get 키워드를 사용하여 name이라는 접근자를 정의합니다.
person.name에 접근할 때, 우리의 접근자 메서드가 호출됩니다.

Getters를 사용하는 이유는 무엇인가요?

계산된 프로퍼티: Getters는 계산된 값을 반환할 수 있습니다.

class Circle {
private _radius: number;

constructor(radius: number) {
this._radius = radius;
}

get area(): number {
return Math.PI * this._radius ** 2;
}
}

let circle = new Circle(5);
console.log(circle.area); // 출력: 78.53981633974483

Lazy Loading: Getters는 필요할 때만 데이터를 로드하여 성능을 높일 수 있습니다.

class DataFetcher {
private _data: string | null = null;

get data(): string {
if (this._data === null) {
console.log("데이터 가져오는 중...");
this._data = "비싼 데이터";
}
return this._data;
}
}

let fetcher = new DataFetcher();
console.log(fetcher.data); // 출력: 데이터 가져오는 중... \n 비싼 데이터
console.log(fetcher.data); // 출력: 비싼 데이터 (이번에는 가져오지 않음)

TypeScript에서 Setters

Setters는 무엇인가요?

Setter는 Getter의 반대 개념입니다. 프로퍼티의 값을 설정하는 메서드로, 종종 추가적인 로직을 포함합니다.

Setters를 어떻게 정의하나요?

기본 예제를 보겠습니다:

class Temperature {
private _celsius: number = 0;

set celsius(value: number) {
if (value < -273.15) {
throw new Error("절대零 이하의 온도는 불가능합니다");
}
this._celsius = value;
}

get celsius(): number {
return this._celsius;
}
}

let temp = new Temperature();
temp.celsius = 25; // 이는 setter를 호출합니다
console.log(temp.celsius); // 출력: 25

// temp.celsius = -300; // 이는 오류를 발생시킵니다

이 예제에서:

우리는 _celsius이라는 private _celsius 프로퍼티를 가진 Temperature 클래스를 가집니다.
celsius에 대한 setter를 정의하여 값을 설정하기 전에 유효성을 검사합니다.

Setters를 사용하는 이유는 무엇인가요?

데이터 검증: Setters는 프로퍼티에 할당되는 값을 유효한지 확인할 수 있습니다.
side effects: Setters는 프로퍼티가 변경될 때 다른 작업을 유발할 수 있습니다.

class User {
private _name: string = "";
private _lastUpdated: Date = new Date();

set name(value: string) {
this._name = value;
this._lastUpdated = new Date();
}

get name(): string {
return this._name;
}

get lastUpdated(): Date {
return this._lastUpdated;
}
}

let user = new User();
user.name = "Bob";
console.log(user.name); // 출력: Bob
console.log(user.lastUpdated); // 출력: 현재 날짜와 시간

접근자 메서드 표

이제 우리가 다룬 접근자 메서드의 요약을 보여드리겠습니다:

접근자 유형	키워드	목적	예제
Getter	`get`	프로퍼티 값을检索	`get name(): string { return this._name; }`
Setter	`set`	프로퍼티 값을 설정	`set name(value: string) { this._name = value; }`

결론

TypeScript의 접근자는 객체 프로퍼티에 대한 접근과 수정을 통제하는 강력한 방법을 제공합니다. 그들은 로직, 검증, 계산된 프로퍼티를 클래스에 추가하여 코드를 더욱 견고하고 유지보수 가능하게 만듭니다.

기억해 두세요, 새로운 기술을 습득하는 것은 연습이 필요합니다. 접근자가 처음에는 이해가 되지 않을 수 있지만, 계속 코딩하고 실험을 하다 보면 곧 프로를처럼 사용할 수 있을 것입니다!

저는 항상 학생들에게 이야기하는 것처럼, 프로그래밍은 새로운 언어를 배우는 것과 같습니다.처음에는 혼란스러울 수 있지만, 인내심과 연습을 통해 곧 유창하게 "말할" 수 있을 것입니다. 즐겁게 코딩하시고, 여정을 즐기세요!

Credits: Image by storyset