2023년 01월 10일 Typescript 공식 문서를 기반으로 작성되었습니다. ✅ Type Alias(타입 별칭)란? 객체 타입이나 유니온 타입을 type annotation으로 직접 타입을 부여하는 것도 편하지만, 매번 타입 값을 부여해주어야 한다. type alias는 새로운 타입 값을 생성하는 것이 아닌 미리 정의한 타입을 나중에 쉽게 참고할 수 있게 이름을 부여하는 것과 같다. 구문 // string 타입을 사용할 때 const name: string = 'capt'; // 타입 별칭을 사용할 때 type MyName = string; const name: MyName = 'capt'; string, number와 같은 간단한 타입뿐만 아니라 모든 타입에 이름을 지정할 수 있다. type De..
✅Enums - 열거형 Enums은 Typescript에서 제공되는 몇 안 되는 자바스크립트의 타입 레벨이 아닌 확장이다. Enums는 명명된 상수 집합을 정의할 수 있으며 숫자형 또는 문자형 기반의 열거형을 제공해 준다. 🤔 주로 어떤 때에 사용될까? 첫 번째 예시 전자 상거래 사이트에서 주문을 할 경우, 아래 코드처럼 '대기 중, 발송됨, 배송 완료'라는 세 가지 상태가 있다. // TS를 사용하지 않을 경우 const PENDING = 0; const SHIPPED = 1; const DELIVERED = 2; if(status === DELIVERED) { // do something... } else 중요한 것은 숫자 2가 아닌 DELIVERED라는 명명된 상수를 사용하여 의미를 명확하게 하고 ..
✅ Union Types 유니온 타입이란 JavaScript의 OR 연산자( || )와 같이 A이거나 B라는 의미의 타입이다. 즉, 유니온 타입을 이용하면 여러 타입의 값을 가질 수 있게된다. let age: number | string | boolean = 21; age = 23; age = "24"; age = true; 적절한 예시는 아니지만 간단한 예시로 유니온 타입을 사용했다. age는 세개의 Type 중 어느 것을 사용해도 상관 없다. type Point = { x: number; y: number; }; type Loc = { lat: number; long: number; }; let coordinates: Point | Loc = { x: 1, y: 34 }; coordinates = {..
✅ Array Types 배열에 타입을 지정하는 방법을 살펴보자. 변수를 선언하고 type에 빈배열을 설정했다. 배열에 무언가 하려하거나 숫자를 넣는 등 초기화를 하면 에러가 발생한다. 왜냐하면 타입이 빈 배열이라고 알려두었기 때문에 항상 아무것도 없어야 한다. 그 대신 배열 대괄호 앞에 어떤 타입인지 밝혀줘야 한다. const activeUsers: string[] = ["jeong", "haha"]; 문자열 배열이라는 의미로 원한다면 빈 상태로 시작할 수 있고, 문자열을 넣어줄 수도 있다. const activeUsers = []; 위 코드처럼 빈배열에 타입을 지정하지 않으면 any 혹은 never이 설정된다. 이것은 ts 설정에 의한 것이며, any가 아닌 never로 뜨기 원한다면 tsconfig..
✅ TypeScript의 객체 TS에서의 객체는 JS와 똑같이 표현된다. const dpg = { name: 'Elton', breed: "Australian Shpherd", age: 0.5 } 타입 추론에 의해 name과 breed는 string 타입, age는 number 타입으로 할당된다. 함수에서 매개변수로 객체를 받는다면 어떻게될까? 직접해보자. const printName = (name: { first: string; last: string }): void => { console.log(`${name.first} ${name.last}`); }; printName이라는 함수에 name객체를 파라미터로 받고 있다. name 파라미터의 키로 first, last가 오며 type은 string이다..
✅ TypeScript의 객체 TS에서의 객체는 JS와 똑같이 표현된다. const dpg = { name: 'Elton', breed: "Australian Shpherd", age: 0.5 } 타입 추론에 의해 name과 breed는 string, age는 number로 할당된다. 함수에서 매개변수로 객체를 받는다면 어떻게될까? 직접해보자. const printName = (name: { first: string; last: string }): void => { console.log(`${name.first} ${name.last}`); }; printName이라는 함수에 name객체를 파라미터로 받고 있다. name 파라미터의 키로 first, last가 오며 type은 string이다. 파라미터를..
✅ any 어떤 타입이어도 상관없는 타입이다. 이걸 최대한 쓰지 않는 게 핵심이다. 왜냐면 컴파일 타임에 타입 체크가 정상적으로 이뤄지지 않기 때문이다. 그래서 컴파일 옵션 중에는 any를 써야 하는데 쓰지 않으면 오류를 뱉도록 하는 옵션도 있다. -noImplicitAny function returnAny(message): any { // error console.log(message); } const any1 = returnAny('리턴은 아무거나') any1.toString() any는 계속해서 개체를 통해 전파된다. 결국, 모든 편의에 의해 any를 사용하는 순간 타입 안정성을 잃는 대가로 온다는 것을 알아야 한다. 타입 안정성은 TS를 사용하는 주요 동기 중 하나이며 필요하지 않은 경우에는 an..
Type Annotation 변수에 기본 타입을 할당하기 위해 변수 이름뒤에 :Type 을 추가한다. 이렇게 특정한 변수 혹은 특정한 개체 등에 어떤 타입이라고 지정해주는 일을 'Type Annotation' 이라고 한다. let myVar: type = value const, let, var로 변수의 이름을 선언하고 콜론(:)과 타입을 쓴다. 타입은 소문자로 작성한다. 대부분의 경우 필요하지 않다. 실제로 변수를 작성할 때는 타입 추론(Inference)을 사용하면 된다. let movieTitle: string = "Maze Runner"; movieTitle = "Arrival"; movieTitle = 9; // Error; Type 'number' is not assignable to type ..
