JS 에서 TS 넘어가기 - 0

🤔 왜 TS를 쓰는 걸까?

사실 우리가 사용하는 웹 브라우저들은 TS 를 인식하지 못합니다.

즉 우리가 TS로 작성을해도 JS로 변환을 해야지 웹 브라우저가 이를 알아먹을 수 있습니다..
🙋 : 그러면 번거롭게 걍 JS 쓰면 안되나요?

간단한 예시를 들어보도록 하겠습니다.

function add( a, b){
	consol.log(a+b)
}

만약 위 함수에서 add() 를 호출하면 어떻게 될까요? 상식적으로는 에러가 나는게 맞지만, JS는 이를 알려주지 않습니다.

그러면 어떻게 동작하냐? undefined + undefined = NaN 이 나오게 됩니다.
그렇다면 몇가지 동작을 더 해보도록 하겠습니다.

add(1) = NaN
add(1,2) = 3
add(3,4,5) = 7
add('hello','world') = helloworld

add(1,2) 를 제외하고는 모두 개발자가 원하는 결과가 나오지 않습니다. 이렇듯 JS는 너무 관대하기 때문에 개발자의 실수를 잘 캐치하지 못합니다.

🙋 JS는 왜 저렇게 관대 하나요?

그 이유는 JS가 가지는 동적 언어라는 언어의 특성 때문입니다. 마치 일본 사람들이 받침 발음을 잘 하지 못하는 것과 유사하죠. ( 비하 절대 아님 ❌ )

동적 언어(JS)는 런타임에 타입이 결정 / 오류가 발견 되는 특징을 가지고 있고 만약 에러가 나면 사용자가 그 에러를 고스란히 볼 수 있습니다.

반면

정적 언어(TS,java)는 컴파일 타임에 타입이 결정 / 오류가 발견 되는 특징을 가지고 있습니다. 코드 작성 시간은 동적 언어 보다 길어지겠지만 처음 작성 시에 섬세하게 작성한다면 동적 언어보다 안정적이고 이후 작업을 빠르게 작업할 수 있는 장점을 가지고 있습니다.

위의 아까의 예시를 TS로 변환하면,

function add( a: number, b : number){
	consol.log(a+b)
}

add() // 에러
add(1) // 에러
add(1,2) -> 정상적인 코드 제외하고는 모두 에러 처리
add(3,4,5) // 에러
add('hello','world') //에러

이렇게 JS에서 C++ / C 에서 처럼 깐깐한 선생님을 초빙할 수 있습니다! 앞으로의 TS 포스팅에서 React에서 TS를 적용하는 것을 천천히 알아보도록 하겠습니다!