HTML&CSS&Javascript/TS 5

[Typescript] 타입 명시(Type Annotation) / 타입 추론(Type Inference) / 타입 표명(Type Assertion) 이란 ?

타입 명시(Type Annotation) 타입 명시란 변수를 선언할 때, 변수 값의 타입을 명시함으로써 변수 값의 데이터 타입을 지정하는 것을 의미한다. Annotate는 "주석을 달다" 라는 사전적인 뜻을 가지고 있다. 타입스크립트에서는 변수, 함수, 함수 반환값의 데이터 타입을 지정하기 위해 "타입 명시(Type annotation)"을 사용한다. 즉, 타입에 주석을 달아준다. 한 번 식별자를 특정 타입으로 annotated 하면 해당 타입만 사용할 수 있다. 다른 타입을 사용하게 되면 타입스크립트 컴파일러가 에러를 던진다. 1) 변수에 타입 지정하기 let a: number; //a라는 변수에는 number 타입의 값만 할당 및 재할당할 수 있다. a = "Mark"; //error a = 23; ..

[Typescript] 타입스크립트 Type 정리

In Typescript, a 'type' is a convenient way to refer to the different properties and functions that a value has. 타입이란 값이 가지고 있는 속성(프로퍼티)이나 함수(메서드)를 추론할 수 있는 편리한 방법이다. 서론 자바스크립트의 값들은 타입에 따라 각각의 프로퍼티와 메서드를 가지고 있다. 예를 들어 위와 같이 "apple" 이라는 값은 단순히 string 문자열이라고 설명할 수도 있지만, 조금 더 상세히 설명하자면 문자열이 가지는 프로퍼티와 메서드를 가지고 있는 값(Value)라고 할 수 있다. 자바스크립트의 문자열은 .length 와 같은 프로퍼티를 가지고, .toLowerCase()나 .split() 등과 같은 ..

[Typescript] Axios config 설정하기

import axios, { AxiosRequestConfig } from 'axios'; const axiosConfig: AxiosRequestConfig = { baseURL: 'BASE_URL' } const client = axios.create(axiosConfig); // client: AxiosInstance const response = await client.get('/user'); const response = await client.post('/user/add', { id: 'mo', name: 'mocci' }); 통신모듈로 axios를 사용할 때 baseURL이나 interceptor, headers 등 공통으로 설정을 적용하고 싶은 경우 config를 적용한 instance를 ..

[Typescript] 열거형(enum) 타입에 관하여

1) Typescript의 'enum' type이란 ? enum Auth { admin = 0, // 관리자를 0으로 표현 user = 1, // 회원은 1로 표현 guest = 2 // 게스트는 2로 표현 } Typescript 는 JS의 기본 타입 외에도 몇 개의 타입을 더 제공하는데, 그 중 하나가 열거형이라고 불리는 enum 이다. enum은 말 그대로, 여러 값들에 미리 이름을 정의하여 열거해 두고 사용하는 타입이다. 2) enum을 사용하는 이유 2-1) 분야 별로 종류를 정의하여 명확하게 사용하기 위함 여러 값들을 분야 별로 정의할 수 있기 때문에, 의미를 명확하게 파악하고 사용할 수 있으며 코드의 가독성을 높일 수 있다. 2-2) 하드코딩의 실수를 줄이기 위함 하드코딩을 막고, 자동완성 기..

[Typescript] 타입스크립트란 ?

1) Typescript란 ? 타입스크립트는 자바스크립트에 타입(Type)을 부여한 언어, 즉 JavaScript로 컴파일 되는 트랜스파일러입니다. 자바스크립트의 확장된 언어라고 볼 수 있습니다. TypeScript 파일(ts)은 웹 브라우저에서 바로 해석될 수 없습니다. 브라우저에서 해석 가능한 언어인 JavaScript로 변환되어야 브라우저는 이를 인식하고 해석할 수 있습니다. 즉, TypeScript를 JavaScript로 변환해야 웹 브라우저에서 실행이 가능합니다. 그래서 TypeScript가 JavaScript로 출력 되기에 컴파일러가 아닌, 트렌스파일러(Transpiler)로 불립니다. 그리고 이러한 언어를 메타 언어(Meta Language)라고 부릅니다. 2) 타입스크립트를 사용하는 이유 ..