[DevCamp] 객체 리터럴과 타입스크립트의 OOP

동건·2025년 4월 4일

DevCamp

목록 보기
41/85

객체 리터럴과 타입스크립트의 OOP

오늘은 객체 리터럴과 배열, 클래스 등 다양한 개념을 학습하고 실습을 해보았다.


1. 객체 리터럴

객체 리터럴은 중괄호 {}를 사용하여 객체를 생성하는 방식으로,
TypeScript 에서도 기본적으로 사용된다.

const employee = {
    name: "Kim",
    age: 25,
    job: "Developer"
};
console.log(employee.name); // Kim

하지만 객체 리터럴을 사용할 때, 명확한 타입을 지정하지 않으면
예기치 않은 값을 할당할 위험이 있다.

이를 해결하기 위해 인터페이스나 타입을 활용할 수 있다.

interface Employee {
    name: string;
    age: number;
    job: string;
}

const employee1: Employee = {
    name: "Lee",
    age: 30,
    job: "Designer"
};

2. 유니온, 타입별칭, 타입가드

유니온 타입 (Union Type)

유니온 타입을 사용하면 하나 이상의 타입을 가질 수 있다.

let value: string | number;
value = "Hello";
value = 100; // 가능

타입 별칭 (Type Alias)

타입을 별칭으로 정의하여 재사용할 수 있다.

type StringOrNumber = string | number;
let value2: StringOrNumber;
value2 = "World";
value2 = 200; // 가능

타입 가드 (Type Guard)

타입 가드는 특정 타입인지 확인하는 역할을 한다.

function isString(value: any): value is string {
    return typeof value === "string";
}

function printValue(value: string | number) {
    if (isString(value)) {
        console.log("문자열: " + value);
    } else {
        console.log("숫자: " + value);
    }
}

3. Array와 Tuple

배열 (Array)

배열은 동일한 타입의 요소를 여러 개 가질 수 있다.

let numbers: number[] = [1, 2, 3, 4];

튜플 (Tuple)

튜플은 서로 다른 타입의 요소를 가질 수 있다.

let person: [string, number] = ["Lee", 30];

4. 클래스와 객체 만들기

클래스 (Class)

클래스는 객체의 구조를 정의하는 틀(설계도) 역할을 한다.

class Employee {
    name: string;
    age: number;
    job: string;

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

const emp1 = new Employee("Park", 28, "Engineer");
console.log(emp1.name); // Park

5. 생성자 (Constructor)

생성자는 클래스의 인스턴스를 생성할 때 호출되며, 초기값을 설정하는 역할을 한다.

class User {
    constructor(public username: string, public age: number) {}
}

const user1 = new User("Kim", 25);
console.log(user1.username); // Kim

6. 접근 지정자 (Access Modifiers)

접근 지정자는 클래스 내부의 멤버 변수와 메서드의 접근 범위를 지정한다.

  • public : 어디서든 접근 가능
  • private : 클래스 내부에서만 접근 가능
  • protected : 해당 클래스 및 상속받은 클래스에서 접근 가능
class Employee {
    public name: string;
    private salary: number;

    constructor(name: string, salary: number) {
        this.name = name;
        this.salary = salary;
    }
}

const emp = new Employee("Choi", 5000);
console.log(emp.name); // 가능
// console.log(emp.salary); // 오류 (private)

7. Getter와 Setter

GetterSetter 를 사용하면 데이터를 안전하게 읽고 변경할 수 있다.

class Employee {
    constructor(private _empName: string, private _age: number, private _empJob: string) {}

    get empName(): string {
        return this._empName;
    }

    set empName(name: string) {
        this._empName = name;
    }
}

let emp = new Employee("Kim", 30, "Developer");
console.log(emp.empName); // Kim
emp.empName = "Lee";
console.log(emp.empName); // Lee

TypeScript 의 OOP 개념을 활용하면 코드의 가독성과 유지보수성을 높일 수 있다.
앞으로 객체 지향 개념을 활용하여 더 복잡한 애플리케이션을 개발해볼 수 있다.

🔨 TIL

  • 객체 리터럴을 사용할 때 인터페이스를 활용하면 안정성을 높일 수 있다.
  • 유니온 타입과 타입 가드를 사용하면 타입 안정성을 높일 수 있다.
  • 클래스는 객체를 만들기 위한 설계도로, 생성자를 통해 초기값을 설정할 수 있다.
  • 접근 지정자를 사용하여 데이터의 접근 범위를 제어할 수 있다.
  • Getter와 Setter를 활용하면 데이터를 안전하게 다룰 수 있다.
profile
배고픈 개발자

0개의 댓글