이펙티브 타입스크립트

🔥 타입스크립트/Effective Typescript

아이템 50 - 오버로딩 타입보다는 조건부 타입을 사용하기

오버로딩 타입이란? 오버로딩 타입은 아이템 3에서 다루었던 개념이다. 다시 정리하자면 다음과 같다. 우선 함수 오버로딩이란 동일한 이름에 매개변수만 다른 여러 버전의 함수를 허용하는 것이다. 하지만 타입스크립트에서는 불가능하다. 타입스크립트에 비슷한 기능을 지원하지만 이는 타입 수준에서만 동작하므로 오버로딩 타입이라고 한다. 즉, 하나의 함수에 대해 여러 개의 선언문을 작성할 수 있지만, 구현체는 오직 하나뿐이다. function add(a: number, b: number): number; // add 함수에 대한 선언문 1 function add(a: string, b: string): string; // add 함수에 대한 선언문 2 // add 함수 구현체 function add(a, b) { r..

🔥 타입스크립트/Effective Typescript

아이템 37 - 공식 명칭에는 상표 붙이기

1. 구조적 타이핑의 관점에서 살펴보기 다음과 같은 코드가 있습니다. type Vector2D = { x: number; y: number; }; type Vector3D = { x: number; y: number; z: number; }; const calculateNorm = (p: Vector2D) => { return Math.sqrt(p.x * p.x + p.y * p.y); }; Vector2D와 Vector3D 타입이 있습니다. calculateNorm 함수도 있는데요. 이 함수는 Vector2D 타입의 매개변수를 받습니다. 때문에 Vector3D 타입의 매개변수를 허용하지 않아야 합니다. 하지만 구조적 타이핑 관점에서 본다면 다음의 코드는 문제가 없습니다. 이를 해결하기 위해선 어떻게 해..

🔥 타입스크립트/Effective Typescript

아이템 16 - number 인덱스 시그니처보다는 Array, 튜플, ArrayLike를 사용하기

1. 자바스크립트에서의 배열 1-1. 배열은 Object이다. const array = [1, 2, 3]; typeof array; // Object 자바스크립트에서 배열의 타입은 Object이다. 1-2. Object은 number 타입으로 접근이 불가능하다. 자바스크립트에서의 객체는 키-값 형태를 가지고 있으며 키는 보통 string(또는 심벌) 타입만 가능하다. 때문에 아래의 예시처럼 기존에 우리가 자주 배열의 값에 접근하기 위해 사용했던 방법은 불가능하다. const array = [1, 2, 3]; array[0]; array[1]; array[2]; 하지만 number 타입의 키로도 접근하는 것에 있어 오류가 나지 않는 이유는 자바스크립트 엔진에서 자동으로 string 타입으로 형변환이 되기 ..

🔥 타입스크립트/Effective Typescript

아이템 15 - 동적 데이터에 인덱스 시그니처 사용하기

1. 인덱스 시그니처란? 공식문서에는 아래와 같이 인덱스 시그니처의 사용 시점에 대해 설명하고 있다. Sometimes you don’t know all the names of a type’s properties ahead of time, but you do know the shape of the values. In those cases you can use an index signature to describe the types of possible values. 타입의 속성을 모르지만 값의 형태를 알고 있을 때, 인덱스 시그니처를 사용하여 타입을 설명할 수 있다. 2. 인덱스 시그니처의 기본 문법 type Props = { [property: string]: string }; Props 타입이 있다...

🔥 타입스크립트/Effective Typescript

아이템 7 - 타입은 값들의 집합이다.

1. 타입은 할당 가능한 값들의 집합 자바스크립트에서는 변수에 다양한 값을 할당할 수 있다. 이러한 값들을 타입스크립트가 런타임 이전에 여기에 할당할 수 있는가?라는 의문을 품고 오류를 체크하기 시작한다. 오류를 통해 타입스크립트에서의 집합이라는 개념에 다가가보자. 1-1. 타입 오류1 타입스크립트가 만약 오류를 발견하면 아래와 같은 오류를 발견할 수 있다. Type 'number' is not assignable to type 'string'. 숫자 타입은 문자열에 타입에 할당을 할 수 없다는 것이다. 이 문구는 집합의 관점에서 아래처럼 해석할 수 있다. 숫자 타입은 문자열 타입의 부분 집합이 아니다.(두 타입의 관계) 1-2. 타입 오류2 또 다른 오류를 보며 집합이라는 개념을 적립해 보자. AB의 ..

noah-dev
'이펙티브 타입스크립트' 태그의 글 목록