JS코드를 TS코드로 변환해보기

JS로 뚝딱 만들어냈던 번역기 코드에 TS를 적용해봤다.

 

TS는 JS와 다르게 정적으로 Type을 받아오는 형식이다.

JS는 동적으로 Type을 부여하기 때문에 발생하는 이런 저런 문제들이 많다.

이를 개선하기 위해 나온 것이 바로 TypeScript이며, 정적으로 타입을 부여하기 때문에 안정성이 높다.

 

doTranslate함수는 AWS translate에 있는 translateText기능을 동작시킨다.

그래서 이 함수가 반환하는 것은 없기 때문에 void로 설정해주었다.

 

input과 outputTextArea는 번역에 필요한 text가 담긴 부분인데 inputText & outputText모두 querySelector이므로

뒤에 !를 붙여주어 무조건 존재함을 표시했다.

 

그리고 번역에 필요한 부분이 params인데

params라는 타입을 따로 정의해주었다.

type을 만들어서 지정해줌으로써 내가 지정한 type외에 다른 값이 설정되거나,

내가 지정한 값이 없으면 오류가 나타나게 된다.

 

이로써 코드의 안정성과 정교함을 높일 수 있었다.

 

지금 내 TypeScript Skill은 낮은 수준이지만 공식문서를 통해 깊게 공부할 필요가 있음을 느꼈다.

JS를 다루는 모든 프로젝트에서 아마 TS가 유용하게 쓰일 것으로 보인다