[TypeScript] 타입 명시

[TypeScript] 타입 명시

 

 

TypeScript 는 아래와 같이 변수명 뒤에 타입을 선언할 수 있다.

 

let foo: string = 'hello'; // foo 라는 변수에 string 값이 들어감을 명시

선언한 타입에 맞지 않는 값을 할당하면 컴파일 시점에 에러가 발생한다.

let bar: number = 100;

이러한 타입의 선언은 개발자가 코드를 예측 할 수 있도록 도와준다. 또한 타입 선언은 타입 체크를 가능하게 하여 문법에러나 타입과 일치하지 않는 값의 할당 등 기본적인 오류를 런타임 이전에 검출한다.

 

function multiply(x: number, y: number): number {
	return x * y;
 }
 
 const multiply2 = (x: number, y: number): number => x * y;

TypeScript 는 JS 의 상위 확장이므로 JS 의 타입을 그대로 사용 할 수 있다. 자바스크립트 타입 이외에 TS 고유의 타입이 추가로 제공된다.

Type	JS	TS	Description
boolean	O	O	true , false
null	O	O	값이 없다는 것을 명시
undefined	O	O	값을 할당하지 않은 변수의 초기값
number	O	O	숫자(NaN, Infinity 포함)
string	O	O	문자열
symbol	O	O	고유하고 수정 불가능한 데이터 타입이며 주로 객체 프로퍼티들의 식별자로 사용
object	O	O	객체
array	O	O	배열
tuple	O	O	고정된 요소 수 만큼의 타입을 미리 선언 후 배열을 표현
enum	O	O	열거형
any	O	O	어떤 타입의 값이라도 할당 가능
void	O	O	함수에서 반환값이 없을 때 사용
never	O	O	결코 발생하지 않는 값

// boolean
let isDone: boolean = false;

// null
let n: null = null;

// undefined
let u: undefined = undefined;

// number
let decimal: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o744;

// string
let color: string = "blue";
color = 'red';
let myName: string = `Lee`; // ES6 템플릿 문자열
let greeting: string = `Hello, my name is ${ myName }.`; // ES6 템플릿 대입문

// object
const obj: object = {};

// array
let list1: any[] = [1, 'two', true];
let list2: number[] = [1, 2, 3];
let list3: Array<number> = [1, 2, 3]; // 제네릭 배열 타입

// tuple : 고정된 요소수 만큼의 타입을 미리 선언후 배열을 표현
let tuple: [string, number];
tuple = ['hello', 10]; // OK
tuple = [10, 'hello']; // Error
tuple = ['hello', 10, 'world', 100]; // Error
tuple.push(true); // Error

// enum : 열거형은 숫자값 집합에 이름을 지정한 것이다.
enum Color1 {Red, Green, Blue};
let c1: Color1 = Color1.Green;

console.log(c1); // 1

enum Color2 {Red = 1, Green, Blue};
let c2: Color2 = Color2.Green;

console.log(c2); // 2

enum Color3 {Red = 1, Green = 2, Blue = 4};
let c3: Color3 = Color3.Blue;

console.log(c3); // 4

/*
any: 타입 추론(type inference)할 수 없거나 타입 체크가 필요 없는 변수에 사용한다.
var 키워드로 선언한 변수와 같이 어떤 타입의 값이라도 할당할 수 있다.
*/
let notSure: any = 4;
notSure = 'maybe a string instead';
notSure = false; // okay, definitely a boolean

// void : 일반적으로 함수에서 반환값이 없을 경우 사용한다.
function warnUser(): void {
  console.log("This is my warning message");
}

// never : 결코 발생하지 않는 값
function infiniteLoop(): never {
  while (true) {}
}

function error(message: string): never {
  throw new Error(message);
}

 

출처 : https://poiemaweb.com/typescript-typing