제네릭은 함수뿐만 아니라 인터페이스와 타입 별칭에도 동일하게 적용할 수 있다. 이를 통해 구조는 같지만 내부 프로퍼티의 타입만 다른 다양한 객체를 효율적으로 정의할 수 있다.1. 제네릭 인터페이스 선언 및 사용인터페이스 이름 뒤에 타입 변수( 등)를 선언하여 사용한다.interface KeyPair { key: K; value: V;}// 명시적 타입 할당 필수let keyPair: KeyPair = { key: "key", value: 0,};let keyPair2: KeyPair = { key: true, value: ["1"],};🚨 주의 사항 (명시적 타입 할당) 제네릭 함수는 전달되는 인수를 통해 타입 변수를 자동으로 추론하지만, 제네릭 인터페이스는 변수의 타입으로 사용할 때 반드시..

1. map 메서드의 제네릭 타입 정의map 메서드는 원본 배열의 각 요소를 순회하며 콜백 함수를 실행하고, 그 반환값들을 모아 새로운 배열로 반환한다.1-1. 단일 타입 변수를 사용한 정의 (문제 발생)초기에는 배열의 타입과 콜백 함수의 반환 타입을 모두 동일한 타입 변수 T로 정의할 수 있다.// 단일 제네릭: 원본 배열과 반환 배열의 타입이 무조건 같아야 함function map(arr: T[], callback: (item: T) => T): T[] { let result = []; for (let i = 0; i it * 2); // ✅ 반환값: number[]문제점: 콜백 함수가 원본과 다른 타입의 값을 반환하려고 하면 타입 에러가 발생한다. (예: number 요소를 string으로 변..

제네릭(Generic)은 함수, 인터페이스, 타입 별칭, 클래스 등을 다양한 타입과 함께 안전하게 재사용할 수 있도록 만들어주는 문법이다. 입력된 타입에 따라 반환 타입이 동적으로 결정되도록 할 때 주로 사용한다.1. 제네릭이 필요한 상황입력된 매개변수를 그대로 반환하는 함수를 만들 때, any나 unknown을 사용하면 타입 안정성이나 효율성 측면에서 문제가 발생한다.any 타입의 문제 (타입 안정성 상실): 함수의 반환값 타입은 return 되는 값을 기준으로 추론된다. 따라서 매개변수가 any 타입일 때 이를 그대로 반환하면, 결괏값 역시 any 타입으로 추론될 수밖에 없다. 이로 인해 변수에 숫자가 할당되었음에도 문자열 메서드를 호출하는 등의 실수를 컴파일 단계에서 잡지 못해 런타임 오류로 이어진..

타입스크립트에서 인터페이스는 객체의 형태뿐만 아니라 클래스의 설계도 역할도 수행한다. 클래스가 가져야 할 필드와 메서드의 규격을 인터페이스로 먼저 정의하고, 이를 기반으로 클래스를 구현할 수 있다.implements 키워드 사용클래스를 선언할 때 implements 키워드와 함께 인터페이스를 지정하면, 해당 클래스는 인터페이스에 정의된 모든 조건을 강제로 만족(구현)해야 한다.// 1. 클래스의 설계도(인터페이스) 정의interface CharacterInterface { name: string; moveSpeed: number; move(): void;}// 2. 인터페이스를 구현(implements)하는 클래스class Character implements CharacterInterface { ..

접근 제어자(Access Modifier)는 타입스크립트에서 클래스의 특정 필드나 메서드에 접근할 수 있는 범위를 제한하는 기능이다. 타입스크립트는 세 가지 접근 제어자를 제공한다.public: 모든 범위에서 접근 가능 (기본값)private: 클래스 내부에서만 접근 가능protected: 클래스 내부 및 자식 클래스 내부에서만 접근 가능1. public어디서든 접근할 수 있음을 의미한다. 필드나 메서드 선언 시 접근 제어자를 생략하면 기본적으로 public이 적용된다. 명시적으로 작성할 수도 있다. class Employee { // 접근 제어자를 생략하면 자동으로 public 적용 public name: string; age: number; position: string; construc..

클래스클래스부터 만들기 전 객체를 먼저 만들면 좋다. 객체 만들기 👉🏻 클래스 만들기 👉🏻 필드 만들기 in 클래스 필드 타입을 정의할 경우 암시적으로 'any' 형식이 포함된다는 오류 메시지가 뜬다. const employee = { name: '이정환', age: 27, position: 'developer', worl() { console.log('일함'); },};class Employee {} 왜?타입을 생략하면 암시적 any 타입으로 추론되어 엄격한 타입 검사 모드(strict: true)에서 오류가 발생한다.(tsconfig.json에서 "noImplicitAny"에서 false를 작성하면 any타입으로 추론하고 오류 사라진다. ← 사용안하는게 좋음) 그래서?타입스크립트..

클래스동일한 구조와 동작을 가진 객체를 더 쉽고 효율적으로 생성하기 위한 템플릿(틀) 문법이다.객체 리터럴({...}) 방식을 사용해 동일한 형태의 객체(예: 학생 정보)를 여러 개 생성하면 코드가 중복된다. 100명, 1,000명의 데이터를 다루어야 한다면 유지보수가 매우 어려워지며, 클래스는 이러한 중복을 제거하고 코드를 구조화하는 데 도움을 준다. 흔히 클래스를 '붕어빵 틀'에, 클래스로부터 생성된 실체 객체를 '붕어빵(인스턴스, Instance)'에 비유한다.let studentA = { name: '이정환', grade: 'A+', age: 27, student() { console.log('열심히 공부함'); }, introduce() { console.log('안녕하세요..

타입 별칭(type)은 동일한 스코프 내에서 중복 선언이 불가능하지만, 인터페이스는 동일한 이름으로 여러 번 선언할 수 있으며, 이들은 자동으로 하나로 합쳐진다. 이를 선언 병합이라고 한다.1. 기본 동작동일한 이름으로 선언된 여러 인터페이스의 프로퍼티들은 최종적으로 하나의 객체 타입으로 병합된다.// 타입 별칭은 중복 선언 불가type User = { name: string; };type User = { age: number; }; // ❌ 에러 발생// 인터페이스는 중복 선언 시 자동 병합됨interface Person { name: string; }interface Person { age: number; }// 병합된 결과: { name: string; age: number; }const perso..

인터페이스 확장이란extends 키워드를 사용하여 기존 인터페이스의 프로퍼티를 다른 인터페이스가 상속받는 문법이다. 이를 통해 중복 코드를 제거하고 유지보수성을 크게 높일 수 있다. interface Animal { name: string; age: number;}interface Dog { name: string; age: number; isBark: boolean;}interface Cat { name: string; age: number; isScratch: boolean;}interface Chicken { name: string; age: number; isFly: boolean;}☝🏻 현재 중복된 인터페이스가 많음1. 기본 문법과 필요성공통된 프로퍼티(name, age 등..