타입스크립트 강의를 보며 개인적으로 기록하는 글입니다.
이번 글에서는 타입스크립트의 장점, 유의사항 및 number, string, boolean 등 기본 타입에 대해 다룹니다.
나비효과 방지
간단한 예시이다. 이렇게 값이 숫자로 정상적으로 들어온다면 상관이 없겠지만
만약 위와 같이 다른 개발자가 오류를 낳을 수 있는 코드를 작성했고, 문제가 발생한다는 것을 인식하지 못하고 넘어간다면 나비효과가 되어 큰 피해로 돌아올 수도 있다. 그리고 이런 점을 타입스크립트가 도울 수 있다.
number 타입
(참고: vscode는 타입스크립트 지원을 기본으로 제공한다.)
매개변수로 number 타입이 넘어올 것이라고 적으면 문자열인 number1을 매개변수로 넘길 수 없다며, 해당 에러가 어디서 발생했는지 보여준다.
장점
위와 같이 타입스크립트는 개발하는 동안 코드의 안정성을 높이고 오류를 사전에 방지하는데 도움을 준다. 이를 통해 개발자는 코드 작성 시 발생할 수 있는 오류를 사전에 방지하고 디버깅 시간을 줄일 수 있다.
유의사항
타입스크립트는 컴파일 시 타입 체크를 통해 오류를 사전에 방지하고 코드 안정성을 높이는 언어이다. 그러나 브라우저에서는 타입스크립트를 직접 실행할 수 없으며, 타입스크립트 코드는 컴파일을 거쳐 자바스크립트로 변환된다. 변환된 자바스크립트 코드는 브라우저에서 실행되며, 런타임에는 자바스크립트 코드와 동일하게 작동한다.
boolean 타입, string 타입
showResult가 true일 경우엔 로그를 찍고, false일 경우 더한 값을 반환하는 함수가 있다고 치자. 만약 여기서 로그를 편하게 보기 위해 phrase를 추가했다.
그러면 콘솔엔 뭐라고 찍힐까?
결과는 아래와 같이 나온다.
같은 버그
앞서 나왔던 버그를 다시 만날 수 있다.
이와 같은 버그를 피하기 위해 코드를 수정해보자.
수정된 코드
숫자 두 개를 더한 값이 문자열과 함께 직접 계산되지 않으므로 항상 숫자가 된다.
여기까지 기본 데이터 타입인 number, string, boolean을 타입스크립트로 다뤄보는 시간을 가졌다. 첨부한 코드들을 통해 타입스크립트는 개발자들에게 안정적이고 효율적인 개발 환경을 제공한다는 점을 다시 한 번 알 수 있는 시간이었다.
