Front-end/Typescript
-
[Effective Typescript] 타입스크립트 알아보기Front-end/Typescript 2021. 10. 5. 02:07
이 글은 이펙티브 타입스크립트 책을 보며 스터디한 내용입니다. 타입스크립트의 독특함 타입스크립트는 사용 방식 면에서 독특한 특징을 가집니다. 인터프리터로 실행되는 것도 아니고, 저수준 언어로 컴파일 되는 것도 아닙니다. 🤔 또 다른 고수준언어인 자바스크립트로 컴파일 되며, 실행 또한 자바스크립트로 이루어지게 됩니다. 😲 타입스크립트는 자바스크립트의 상위 호환 타입스크립트에 대해 알아볼 때 자바스크립트의 상위 호환이라는 말을 굉장히 많이 들어보셨을텐데요 이유는 다음과 같습니다. 문법의 상위집합 문법적으로 상위에 있다는 말은 자바스크립트에서 가지고 있지 않은 부분을 타입스크립트는 가지고 있기 때문입니다. // typescipt function greet(who: string) { console.log(who..
-
[Typescript + React] 사용자 정의 타입 가드로 컴포넌트 props 다루기Front-end/Typescript 2021. 7. 29. 23:23
타입 가드(Type Guards)가 뭐예요..? 🤔 타입 가드는 단어에서 유추가 가능하듯이 타입을 방어해준다는 의미입니다. 예를 들어, 어떤 UNION 타입의 인자가 있을 때 그 타입 중 어떤 타입을 선택하여 함수를 이룰지 결정하는 부분이 됩니다. function typeGuard(type: OneType | TwoType) { // do something.. } 위와 같은 예시가 될텐데요! 여기서 타입가드를 사용하지 않는다면 두 타입이 구분이 되지 않아 원치 않는 결과가 발생할 확률이 높아집니다. 하지만 여기서 타입 가드를 사용하여 특정 타입에 대한 조건을 만족시키면 개발자가 원하는 결과를 얻도록 도와주게 되고, 이 때 가장 중요한 점은 런타임 단계가 아닌 컴파일 단계에서 일명 빨간줄로 알려주기 때문에..