[타입스크립트] 타입스크립트 필수문법 간략 정리

타입스크립트의 필수문법에 대해서 간략하게 정리해보겠다. 

 

변수의 타입 : 

먼저, 변수의 타입을 정하는 방법이다. 

let 이름 :string = 'kim'

자바스크립트와 동일하게 변수를 선언하고, 선언한 변수의 이름 옆에 변수의 타입을 정해준다. 그렇게하고 나면 무조건 해당 타입만 할당된다. string으로 타입을 지정했는데, 만약 number의 값을 할당하게되면 에러가 난다. 

 

배열과 객체는 어떻게 타입을 선언할까? :

이름에 배열을 저장하려고 한다. 이름이라는 변수에는 배열만 넣고 싶다면 어떻게 해야할까? 

let 어레이 :[] = ['배열'] // 배열로 타입을 정하고 싶으면 :[] 만 붙여주면 된다. 

let 이름 :string[] = ['kim', 'park']
let 나이 :{ age : number } = { age : number }

변수를 선언하고 그 옆에 :[]라고 붙여주면 해당 변수는 어레이만 받겠다는 말이다. 그 밑에 코드를 보자. 저 코드는 배열만 받을 건데, 그 배열 중에서도 문자열만 받겠다는 것이다. string[]은 문자열 배열만 들어와야 한다는 말이다. 

다음으로는 객체형이다. 객체형으로 타입지정은 {name: string}이라는 식으로 지정하면 된다. 무조건 이렇게 넣어야 한다. 

만약 {name?:string}이라고 작성하면 name이라는 키값이 들어올 숟도 있고 아닐수도 잇다는 말이다. 

 

유니온 타입 : 

타입을 하나만 정하지 않고 두가지로 정하고 싶으면 어떻게 해야할까? 

이름 : string | number = 'kim'

이렇게 :something | other 의 형식으로 선언하면 된다. 이렇게 선언하는 것을 유니온 타입이라고 부른다. 이렇게 하면 둘 중 하나로 값이 들어올 수 있다. 여러가지 응용이 가능하다. 

 

타입을 변수로 선언하기 : 

타입을 변수에 담아서 사용할 수도 있다. 

type NewType = string | number; 

let 이름 : NewType  = 'kim';

type이라는 키워드를 통해서 타입변수를 선언할 수 있다. NewType이라는 변수에는 현재 string과 number가 저장되어 있다. 이 변수를 가져다 사용한 이름이라는 변수에서는 string과 number 둘 중 하나를 받을 수 있다. 

 

 

함수 파라미터와 반환값의 타입정하기 : 

function 함수(x : number ) : number {
	return x * 2 
}

파라미터의 타입을 지정해주고 싶으면, 파라미터 안에서 타입을 정해주고, 만약 return값의 타입을 지정해주고 싶으면 파라미터 옆에 :를 붙여서 타입을 지정해주면 된다. 

그래서 저 함수는 무조건 숫자로 파라미터가 들어어고, 숫자로 반환값이 나오게 된다. 

 

 

튜플 자료형 : 

type Member = [number, boolean];
let john:Menber = [123, 123] // <-- 에러o , [123, true] <-- 에러x

Member라는 타입변수를 선언했다. 이건 무슨 말이냐. 무조건 첫번째에는 숫자, 두번째에는 불리언 값이 들어와야 한다는 것이다. 

만약 여기서 [숫자, 불리언]과 같은 값이 아니라 값을 넣으면 에러가 날 것이다. 

 

 

객체에 타입을 지정해야 할 속성이 너무 많은 경우에는? :

type Member = {
name : string
}

이렇게 타입을 지정한 경우 이 객체는 name이라는 키값만 가질 수 있다. 

let john : Member = {name: 'kim'}

그래서 여러가지 키 값을 한번에 string으로 지정하고 싶을 때는 

type Member = {
[key : string] : string,
}

let john : Member = { name : 'kim' }

이렇게 정해주면 된다. 이렇게하고 나면 어떤 키값이든 string이면 다 넣을 수 잇다.