개발로그
close
프로필 배경
프로필 로고

개발로그

  • 분류 전체보기 (511)
    • JAVA (68)
      • 자바소개 (4)
      • 자바 기본 문법 (22)
      • 객체 지향 프로그래밍 (15)
      • 예외 처리 (9)
      • 스레드 (18)
    • Databases (14)
      • JDBC (13)
      • Hibernate ORM (1)
    • GIT (39)
      • 시작하기 (5)
      • GIT의 기초 (7)
      • Git 브랜치 (6)
      • Git 서버 (7)
      • Git 분산 환경 (6)
      • Git 도구 (8)
    • 알고리즘 (41)
      • 자료구조 (24)
      • 검색 알고리즘 (0)
      • 초급 알고리즘 (17)
      • 중급 알고리즘 (0)
      • 고급 알고리즘 (0)
    • 코딩문제 (35)
    • D3 (47)
      • D3 소개 (2)
      • 시각화 (45)
    • Docker (30)
    • Kubernetes(K8S) (2)
    • 도구 (39)
      • 프리미어프로 (39)
    • 브라우저 (32)
    • JavaScript (79)
    • TypeScript (38)
    • REACT (13)
      • 리액트 학습하기 (13)
      • 리액트 API (0)
      • 리액트 DOM API (0)
    • React Native (19)
    • Electron (15)
    • 인증 (0)
  • 홈
  • 태그
  • 방명록
[TypeScript] 유틸리티 타입: 복잡한 타입을 간단하게 제공

[TypeScript] 유틸리티 타입: 복잡한 타입을 간단하게 제공

Awaited`Awaited`은 `Promise`를 재귀적으로 풀어 내부 값의 타입을 반환합니다.type AsyncString = Awaited>; // stringtype NestedNum = Awaited>>; // numbertype Mixed = Awaited>; // string | booleanconst str: AsyncString = "안녕";const num: NestedNum = 123;const mix: Mixed = false;console.log(str, num, mix); // 출력: 안녕 123 falsePartialPartial은 주어진 타입의 모든 속성을 선택적(optional) 속성으로 바꿉니다.interface Profile { name: string; age: nu..

  • format_list_bulleted TypeScript
  • · 2025. 2. 28.
  • textsms
[TypeScript] 클래스: 타입 안정성과 객체 지향의 만남

[TypeScript] 클래스: 타입 안정성과 객체 지향의 만남

클래스 기본 구조와 필드 선언가장 기본적인 클래스는 아무런 멤버도 없는 빈 클래스입니다.class EmptyClass {}그러나 실용적인 클래스는 데이터를 저장하기 위해 필드를 선언합니다. 필드는 기본적으로 public이며, 명시적 타입 지정과 초기값 할당이 가능합니다.class Coordinate { x: number; y: number; // 필드 초기값으로 타입 추론 z = 0;}const point = new Coordinate();point.x = 10;point.y = 20;console.log(`좌표: (${point.x}, ${point.y}, ${point.z})`);// 출력: 좌표: (10, 20, 0)엄격한 속성 초기화와 확실한 할당TypeScript의 --strictProp..

  • format_list_bulleted TypeScript
  • · 2025. 2. 27.
  • textsms
[TypeScript] 템플릿 리터럴 타입: 문자열 동적으로 다루기

[TypeScript] 템플릿 리터럴 타입: 문자열 동적으로 다루기

기본 템플릿 리터럴 타입템플릿 리터럴 타입은 백틱(```)과 `${}`를 사용해 문자열을 조합합니다.type Region = "seoul";type Welcome = `어서오세요, ${Region}!`;const msg: Welcome = "어서오세요, seoul!";console.log(msg); // 출력: 어서오세요, seoul!유니온과의 결합템플릿 리터럴 타입은 인터폴레이션 부분에 유니온 타입을 사용하면, 각 멤버와 결합된 새로운 리터럴 타입의 유니온을 생성할 수 있습니다.type Action = "create" | "update";type Entity = "user" | "order";type OperationID = `${Action}_${Entity}_action`;// OperationID..

  • format_list_bulleted TypeScript
  • · 2025. 2. 27.
  • textsms
[TypeScript] Mapped Types로 타입 재사용하기

[TypeScript] Mapped Types로 타입 재사용하기

Mapped Types의 기본: 속성 변환Mapped Types는 주로 인덱스 시그니처 문법을 활용하여 기존 타입의 모든 속성을 대상으로 새로운 타입을 생성합니다.interface AppState { loading: number; error: string;}type BooleanState = { [K in keyof T]: boolean;};type AppFlags = BooleanState;const flags: AppFlags = { loading: false, error: true,};console.log(flags); // 출력: { loading: false, error: true }매핑 수정자: 속성 제어`+`와 `-`로 `readonly`나 선택적 속성(`?`)을 추가하거나 제거할 ..

  • format_list_bulleted TypeScript
  • · 2025. 2. 27.
  • textsms
[TypeScript] 조건부 타입: 입력과 출력의 유연함

[TypeScript] 조건부 타입: 입력과 출력의 유연함

조건부 타입 기본 문법조건부 타입의 기본 형태는 다음과 같습니다.type Result = T extends U ? X : Y;예제: 문자열 여부 검사타입 매개변수 T가 문자열이면 true, 그렇지 않으면 false를 반환하는 조건부 타입입니다.type IsString = T extends string ? true : false;type Test1 = IsString; // truetype Test2 = IsString; // false제네릭과 조건부 타입의 결합제네릭과 결합하면 입력에 따라 출력 타입을 유연하게 정의할 수 있습니다.interface StringData { value: string; format: "text";}interface NumberData { value: number; ..

  • format_list_bulleted TypeScript
  • · 2025. 2. 27.
  • textsms
[TypeScript] 인덱스 액세스 타입(Indexed Access Types): 객체 속성 정밀 추출

[TypeScript] 인덱스 액세스 타입(Indexed Access Types): 객체 속성 정밀 추출

인덱스 액세스 타입이란인덱스드 액세스 타입은 `Type["property"]` 문법으로 객체 타입에서 특정 속성의 타입을 가져옵니다.interface User { id: string; name: string; active: boolean;}type UserName = User["name"]; // stringconst getName = (user: User): UserName => user.name;const user: User = { id: "u1", name: "지훈", active: true };console.log(getName(user)); // 출력: 지훈`User["name"]`으로 `name` 속성의 타입(`string`)을 추출.유니언과 keyof 활용인덱스 타입 자체가 타입이므로,..

  • format_list_bulleted TypeScript
  • · 2025. 2. 27.
  • textsms
  • navigate_before
  • 1
  • 2
  • 3
  • 4
  • ···
  • 7
  • navigate_next
공지사항
전체 카테고리
  • 분류 전체보기 (511)
    • JAVA (68)
      • 자바소개 (4)
      • 자바 기본 문법 (22)
      • 객체 지향 프로그래밍 (15)
      • 예외 처리 (9)
      • 스레드 (18)
    • Databases (14)
      • JDBC (13)
      • Hibernate ORM (1)
    • GIT (39)
      • 시작하기 (5)
      • GIT의 기초 (7)
      • Git 브랜치 (6)
      • Git 서버 (7)
      • Git 분산 환경 (6)
      • Git 도구 (8)
    • 알고리즘 (41)
      • 자료구조 (24)
      • 검색 알고리즘 (0)
      • 초급 알고리즘 (17)
      • 중급 알고리즘 (0)
      • 고급 알고리즘 (0)
    • 코딩문제 (35)
    • D3 (47)
      • D3 소개 (2)
      • 시각화 (45)
    • Docker (30)
    • Kubernetes(K8S) (2)
    • 도구 (39)
      • 프리미어프로 (39)
    • 브라우저 (32)
    • JavaScript (79)
    • TypeScript (38)
    • REACT (13)
      • 리액트 학습하기 (13)
      • 리액트 API (0)
      • 리액트 DOM API (0)
    • React Native (19)
    • Electron (15)
    • 인증 (0)
최근 글
인기 글
최근 댓글
태그
  • #Javascript
  • #브라우저
  • #프리미어프로
  • #java
  • #docker
  • #git
  • #코딩문제
  • #알고리즘
  • #TypeScript
  • #D3
전체 방문자
오늘
어제
전체
Copyright © 쭈미로운 생활 All rights reserved.
Designed by JJuum

티스토리툴바