홍준혁

타입스크립트 사용해보기 본문

타입스크립트

타입스크립트 사용해보기

홍준혁 [Hong-JunHyeok] 2021. 1. 21. 13:12
728x90

타입 스크립트는 자바스크립트의 확장된 개념이다.

 

타입 스크립트에서 가장 중요한 개념은 바로 '타입'인데,

바로 타입스크립트에서 타입을 지정하는 방법을 배워보도록 하자.

 

자바스크립트 형식대로 sayHello라는 함수를 만들었다.

하지만 우리는 name이라는 파라미터에 타입을 지정해주지 않아서 빨간 줄이 떴다. (실행은 된다.)

 

그러면 이제 name에 파라미터를 전달해 줘서 저 빨간줄을 없애보겠다.

이렇게, :string을 붙여서 name에 문자 타입을 주었다.

이렇게 간단하게 타입을 지정해줄 수 있다.

 

예를들어 숫자 타입을 주고 싶으면 :number 불리안 타입을 주고 싶으면 :boolean을 주면 된다. 

 

이 타입은 배열 타입도 줄 수 있다.

이런식으로 type + [] 하면 된다.

 

 

그다음 interface라는 걸 해볼 건데, 이것도 타입을 지정하는 것이다.

 

이런 형식으로 타입을 지정해 줄 수 있다.

interface 말고 type이라는 것도 있는데 interface와 크게 다르지 않다.

 

interface와 type 중 뭘 써야 하는지는 쓰는 사람 마음인 것 같다.

 

제네릭이라는 게 있는데 이건 어떤 경우에 사용하냐면,

만약에 이런 경우가 있다고 해보자.

타입 스크립트에서 any라는 것은 동적 자료형을 의미하는데 아무 값이나 들어와도 된다는 뜻이다.

하지만 이렇게 되면 타입 유추가 안되고 타입 스크립트를 사용하는 의미가 없어지는데,

 

그래서 제네릭이라는 걸 사용해서 이러한 경우를 예방할 수 있다.

 

꺽쇠 모양 안에 A , B를 적어 줬는데 이걸 해주게 되면, 제네릭에 해당되는 타입을 유추할 수 있게 된다.

 

쉽게 예를 들어보자면,

이렇게 a가 number라는 것으로 유추를 할 수 있게 되는 것이다.

 

이 제네릭은 interface나 type에서도 적용이 가능하다.

 

이렇게 간단하게 타입 스크립트를 사용해 보았다.

728x90
Comments