일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |
- typescript 튜토리얼
- 타입 스크립트
- TypeScript
- 리액트 환경설정
- typescript-react-nextjs
- angular trackby
- graphql
- 리액트 셋팅
- 타입스크립트 기초
- graphql 개념
- 앵귤러 최적화
- 리액트 아토믹
- typescript 기초
- 타입스크립트
- 타입스크립트 tutorial
- 타입스크립트 튜토리얼
- 타입스크립트 매뉴얼
- angular optimization
- graphql 설명서
- typescript manual
- react atomic
- react setting
- react storybook
- 리액트 구조
- 리액트 스토리북
- angular 최적화
- typescript 정독
- stroybook
- angular lazy loading
- 프론트
- Today
- Total
valleycho
typescript tutorial(4탄) 본문
7. 기본 타입
7.1 boolean
const isTypeScriptAwesome: boolean = true;
const doesJavaScriptHasTypes: boolean = false;
7.2 number
const yourScore: number = 100;
const ieee754IsAwesome: number = 0.1 + 0.2;
7.3 null / undefined
null 타입과 undefined 타입은 각각 null과 undefined라는 하나의 값만을 갖는다. 이 두 값을 자기 자신의 타입, 그리고 아래에서 언급될 void 타입 이외의 타입에 할당하려 하면 타입 에러(TS2322: Type 'null' is not assignable to type 'number' 등)가 발생한다.
const nullValue: null = null;
const undefinedValue: undefined = undefined;
const numberValue: number = null; // TS2322: Type 'null' is not assignable to type 'number'
7.4 any
any 타입은 모든 타입과 호환 가능.
let bool: any = true;
bool = 3;
bool = 'whatever';
bool = {};
7.5 void
void는 null과 undefined 만을 값으로 가질 수 있는 타입이다. 아무런 값도 반환하지 않는 함수의 반환 타입을 표시할 때 사용한다.
function nothing(): void { }
7.6 never
never는 아무런 값도 가질 수 없는 타입이다.
function alwaysThrow(): never {
throw new Error(`I'm a wicked function!`);
}
8. 배열과 튜플
8.1 배열
const pibonacci: number[] = [0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55];
const myFavoriteBeers: string[] = ['Imperial Stout', 'India Pale Ale', 'Weizenbock'];
배열 타입을 표현하는 또 다른 방식이 있다.
const pibonacci: Array<number> = [0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55];
const myFavoriteBeers: Array<string> = ['Imperial Stout', 'India Pale Ale', 'Weizenbock'];
배열 타입을 표현하는 또 다른 방식이 있다.
8.2 튜플
튜플 타입을 이용해 원소의 수와 각 원소의 타입이 정확히 지정된 배열의 타입을 정의 할 수 있다.
튜플 타입 변수는 정확히 명시된 개수 만큼의 원소만을 가질 수 있다. (TypeScript 2.6 이후 버전)
const invalidNameAndHeight: [string, number] = ['안희종', 176, 42];
다만 튜플 타입의 값을 Array 프로토타입의 메소드를 통해 조작하는 것은 금지되지 않는다는 점에 유의해야 한다. 예를 들어 아래와 같은 코드는 에러를 내지 않는다.
const validNameAndHeight: [string, number] = ['안희종', 176];
validNameAndHeight.push(42); // no error
9. 객체
9-1. 객체 타입
const user: { name: string; height: number; } = { name: '안희종', height: 176};
-
콜론(:)의 우변에는 값 대신 해당 속성의 타입이 들어간다.
-
구분자로 콤마(,) 뿐만 아니라 세미콜론(;)을 사용할 수 있다.
9-2. 선택 속성
함수의 선택 매개변수와 비슷하게 속성명 뒤에 물음표(?)를 붙여 해당 속성이 존재하지 않을 수도 있음을 표현할 수 있다.
const userWithUnknownHeight: { name: string; height?: number; } = {
name: '김수한무'
};
9-3. 선택 속성
속성명 앞에 readonly 키워드를 붙여 해당 속성의 재할당을 막을 수 있다. readonly 키워드가 붙은 속성은 const 키워드를 이용한 변수의 정의와 비슷하게 동작한다.
const user: {
readonly name: string;
height: numer;
} = { name: '안희종', height: 176 };
user.name = '종희안'; // error TS2540: Cannot assign to 'name' because it is a constant or a read-only property.
10. 타입 별칭
타입 별칭(type alias)을 이용해 이미 존재하는 타입에 다른 이름을 붙여 복잡한 타입을 간단하게 쓸 수 있다.
type UUID = string;
type Height = number;
type AnotherUUID = UUID;
type Animals = Animal[];
type User = {
name: string;
height: number;
};
11. 함수
ahnheejong.gitbook.io/ts-for-jsdev/03-basic-grammar/function
3.5 함수
자바스크립트 프로그램에서 가장 핵심적인 역할을 차지하는 함수 타입이 타입스크립트에서 어떻게 표현되는지 다룬다.
ahnheejong.gitbook.io
12. 제네릭
ahnheejong.gitbook.io/ts-for-jsdev/03-basic-grammar/generics
3.6 제너릭
제너릭을 이용해 여러 타입에 대해 동일한 규칙을 갖고 동작하는 타입을 손쉽고 우아하게 정의할 수 있다.
ahnheejong.gitbook.io
13. 유니온
(유니온 타입이 나온 이유를 읽어보면 좋다.)
ahnheejong.gitbook.io/ts-for-jsdev/03-basic-grammar/union-type
3.7 유니온 타입
유니온 타입을 이용해 “여러 경우 중 하나”인 타입을 표현할 수 있다.
ahnheejong.gitbook.io
유니온 타입은 가능한 모든 타입을 파이프(|) 기호로 이어서 표현
type Whatever = number | string | boolean;
14. 인터섹션
(인터섹션 타입이 나온 이유를 읽어보면 좋다.)
ahnheejong.gitbook.io/ts-for-jsdev/03-basic-grammar/intersection-type
3.8 인터섹션 타입
인터섹션 타입을 이용해 “여러 경우에 모두 해당”하는 타입을 표현할 수 있다.
ahnheejong.gitbook.io
여러 타입을 앰퍼샌드(&) 기호로 이어서 인터섹션 타입을 나타낼 수 있다.
type BeerLovingProgrammer = Programmar & BeerLover;
15. 열거형
(읽어 보면 좋음)
ahnheejong.gitbook.io/ts-for-jsdev/03-basic-grammar/enums
3.9 열거형
유한한 경우의 수를 갖는 값의 집합을 표현하기 위해 사용하는 열거형(enum) 타입에 대해 배운다.
ahnheejong.gitbook.io
enum Direction {
East,
West,
South,
North
}
const east: Direction = Direction.East;
'typescript(타입 스크립트)' 카테고리의 다른 글
typescript tutorial(5탄) (0) | 2020.11.09 |
---|---|
typescript tutorial(3탄) (0) | 2020.11.08 |
typescript tutorial(2탄) (0) | 2020.11.08 |
typescript tutorial(1탄) (0) | 2020.11.04 |