티스토리 뷰

728x90

# 타입스크립트(TypeScript)

타입스크립트란, Microsoft에서 개발한 자바스크립트의 슈퍼셋 프로그래밍 언어입니다. .ts확장자를 사용합니다.

 

 

# 자바스크립트와 타입스크립트 비교하기

타입스크립트는 자바스크립트보다 엄격히 타입의 사용을 명시하기 때문에 자바스크립트를 사용했을 때보다 버그를 최소화할 수 있습니다.

 

아래 예시는 각각 자바스크립트와 타입스크립트를 사용하여 더하기 연산을 수행하는 함수를 작성한 코드입니다.

자바스크립트에서 add함수에 인자로 문자열을 넣어주어도 오류가 발생하지 않고 문자열을 연결하여 값을 출력해줍니다.

//Javascript

functiona add(a, b){
	return a + b;
}

console.log(add('1', '4')); // 출력 : 14

하지만, 타입스크립트에서는 add함수에 인자값들의 타입을 number로 명시해주었기 때문에 add함수에 문자열을 넣어주면 데이터 타입이 숫자형이기 때문에 에러를 발생시켜줍니다.

// typescript

fuction add(a : number, b : number){
	return a + b;
}

console.log(add('1','4')); // error!

 

# 타입스크립트의 기본 타입

 

Boolean, Number, String

let isChecked : boolean = false;
let num : number = 3;
let name : string = '송우든';

 

String 타입은 " " 큰따옴표 또는 ' ' 작은따옴표로도 사용이 가능하며 ` 백 틱을 사용하여 표현식이 포함하여 사용할 수 있습니다.

let userMajor : string = "computerScience";
let sentence : string = `Hi, my name is ${userName}.
                         my major is ${userMajor}`;

 

Array

배열 타입은 아래와 같이 두가지 방법을 사용하여 지정할 수 있습니다.

let userArr : string[] = ['aaa','bbb','ccc'];
//let userArr : Array<string> = ['aaa','bbb','ccc'];

 

Tuple

타입스크립트에서는 기존 자바스크립에는 없는 tuple이 존재하는데요!

tuple은 배열과 비슷하지만 고정된 요소수만큼의 타입을 미리 선언 후 배열을 표현할 수 있습니다.

// tuple
let userInfo : [string, number] = ['송우든', 24];
console.log(userInfo); // ['송우든', 24]

 

Enum

열거형. 숫자값 집합에 이름을 지정하여 사용하는 타입입니다.

enum은 0부터 시작으로 멤버 번호를 부여하며, 수동으로 지정해줄 수 있습니다. 또한, 멤버 번호를 이용하여 해당 값을 가져올 수 있습니다.

enum userInfo {name, age, major}
let user: userInfo = userInfo.age;
console.log(user); // 
console.log(userInfo[1]); // age

 

Any

any는 타입 추론을 할 수 없거나 타입 체크를 필요로 하지 않는 값에 사용합니다.

let foo: any = 4;
foo = "any 타입!";
console.log(foo);

 

Void

void는 타입이 전혀 없다는 의미로 any와는 반대되는 개념을 말합니다. 반환값이 없는 함수의 반환 타입으로 void를 사용합니다.

function showMessage() : void {
    console.log('message!');
}
showMessage(); // message!

 

Null 및 Undefined

let userAge : undefined = undefined;
let userName : null = null;

 

Never

never는 결코 발생하지 않는 값의 타입을 말합니다.

 

Object

number, string, boolean, symbol, null 또는 undefined가undefined 아닌 타입을 나타내는 타입입니다.

728x90
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크