Typescript15 Typescript | 조건부 타입, infer 조건부 타입조건부 타입은 extends 와 삼항 연산자를 이용해 조건에 따라 각각 다른 타입을 정의하도록 돕는 문법이다. type A = number extends string ? number : string;위 조건부 타입의 조건식 number extends string은 number 타입이 string 타입의 서브타입이 아니기 때문에 거짓이 되고 그 결과 타입 A는 string 타입이 된다.type ObjA = { a: number;};type ObjB = { a: number; b: number;};type B = ObjB extends ObjA ? number : string;B는 ObjB는 ObjA의 서브 타입 이므로 조건식이 참이되어 number 타입이 된다.제네릭 조건부 타입조건부 타입.. 2024. 11. 4. Typescript | 타입조작 ( Indexed Access Type, key of & typeof 연산자, mapped Type, Template literal Type ) 타입조작 타입을 조작한다는 것은 기본 타입이나 별칭 또는 인터페이스로 만든 원래 존재하던 타입들을 상황에 따라유동적으로 다른 타입으로 변환하는 타입스크립트의 강력하고도 독특한 기능이다. Indexed Access Type인덱스를 이용해 다른 타입내의 특적 프로퍼티의 타입을 추출하는 타입이다.객체, 배열, 튜플에 사용할 수 있다. 객체 프로퍼티의 타입 추출하기다음과 같은 게시글을 표현하는 객체 타입이 있다고 가정한다. 그리고 게시글도 하나 변수로 만들어 준다.interface Post { title: string; content: string; author: { id: number; name: string; };}const post: Post = { title: "게시글 제목", co.. 2024. 11. 4. Typescript | 제네릭 인터페이스, 제네릭 타입 별칭, 제네릭 클래스, Promise와 제네릭 제네릭 인터페이스제네릭은 인터페이스에도 적용할 수 있다. 다음과 같이 인터페이스에 타입 변수를 선언해 사용하면 된다.//키페어를 저장하는 객체의 타입을 제네릭 인터페이스로 정의interface KeyPair { key: K; value: V;}다음과 같이 변수의 타입으로 정의해서 사용할 수 있다.let keyPair: KeyPair = { key: "key", value: 0,};let keyPair2: KeyPair = { key: true, value: ["1"],}; 인덱스 시그니쳐와 함께 사용하기제네릭 인터페이스는 인덱스 시그니쳐와 함께 사용하면 기존보다 훨씬 유연한 객체 타입을 정의할 수 있다.interface Map { [key: string]: V;}let stringMap: M.. 2024. 11. 3. Typescript | 제네릭, 타입 변수 응용, map, forEach 메서드 타입 정의 제네릭함수나 인터페이스, 타입 별칭, 클래스 등을 다양한 타입과 함께 동작하도록 만들어 주는 타입스크립트의 기능 중 하나제네릭이 필요한 상황다양한 타입의 매개변수를 받고 해당 매개변수를 그대로 반환하는 함수가 하나 필요하다고 가정function func(value: any) { return value;}let num = func(10);// any 타입let str = func("string");// any 타입다양한 타입의 매개변수를 제공받아야 하기 때문에 매개변수 value의 타입을 일단 any 타입으로 지정한다.이 함수는 인수로 전달한 값을 그냥 그대로 반환하는 단순한 함수이다.따라서 변수 num에는 10이 저장되고 변수 str에는 “string”이 저장된다.그런데 현재 num과 str의 타입은 .. 2024. 11. 3. Typescript | 클래스, 접근 제어자, 인터페이스와 클래스 TS 의 클래스타입스크립트에서는 클래스의 필드를 선언할 때 타입 주석으로 타입을 함께 정의해주어야 한다.그렇지 않으면 함수 매개변수와 동일하게 암시적 any 타입으로 추론되는데 엄격한 타입 검사 모드(strict 옵션이 true로 설정되어 있을 경우)일 때에는 오류가 발생하게 된다.추가로 생성자에서 각 필드의 값을 초기화 하지 않을 경우 초기값도 함께 명시해주어야 한다.class Employee { // 필드 name: string = ""; age: number = 0; position: string = ""; // 메서드 work() { console.log("일함"); }}만약 다음과 같이 생성자 함수에서 필드의 값들을 잘 초기화 해 준다면 필드 선언시의 초기값은 생략해도 된다.c.. 2024. 11. 2. Typescript | 인터페이스, 확장, 선언 합치기 인터페이스인터페이스란 타입 별칭과 동일하게 타입에 이름을 지어주는 또다른 문법//간단한 Person 객체의 타입을 정의한다면 다음과 같이 할 수 있다interface Person { name: string; age: number;}//이렇게 정의한 인터페이스를 타입 주석과 함께 사용해 변수의 타입을 정의할 수 있다const person: Person = { name: "이재민", age : 30};인터페이스는 타입 별칭과 문법만 조금 다를 뿐 기본적인 기능은 거의 같다고 볼 수 있다.선택적 프로퍼티인터페이스에서도 동일한 방법으로 선택적 프로퍼티 설정이 가능함interface Person { name: string; age?: number;}const person: Person = { name.. 2024. 11. 2. 이전 1 2 3 다음
