TypeScript (4) 썸네일형 리스트형 우아한 타입스크립트 with 리액트 / 6장 타입스크립트 컴파일 런타임과 컴파일타임프로그래밍 언어는 일반적으로 고수준(high-level)과 저수준(low-level) 언어로 구분할 수 있다.고수준 -> 사람이 이해하기 쉬운 형식저수준 -> 컴퓨터가 이해하기 쉬운 형식 자바스크립트는 대표적인 고수준 언어에 속하며 컴파일러나 인터프리터에 의해 저수준프로그래밍 언어로 번역되어 실행된다. 개발자가 작성한 소스코드는 컴파일러에 의해 기계어 코드로 변환되어 실행이 가능한 프로그램이되는데 이 단계를 컴파일타임이라고 부르며, 컴파일이 완료되면 프로그램이 메모리에 적재되어실행되는데 이 시간을 런타임이라고 한다.자바스크립트의 런타임자바스크립트의 런타임은 자바스크립트가 실행되는 환경을 의미한다. ex) 크롬, Node.js런타임은 다양한 구성 요소로 이루어져 있고 대표적으로는 자바스크.. 우아한 타입 스크립트 with 리액트 / 4장 타입 확장하기, 좁히기 타입 확장하기타입 확장은 기존 타입을 사용해서 새로운 타입을 정의하는 것을 말한다.기본적으로 타입스크립트에서는 interface와 type 키워드를 사용해서 타입을 정의하고,extends, 교차 타입, 유니온 타입을 사용하여 타입을 확장한다. 타입 확장의 장점타입 확장의 가장 큰 장점은 코드 중복을 줄일 수 있다는 것이다.코드를 작성하다 보면 중복되는 타입 선언이 생기기 마련인데, 이때 중복되는 타입을반복 선언하는 것보다 기존에 작성한 타입을 바탕으로 타입 확장을 함으로써불필요한 코드 중복을 줄일 수 있다.interface Item { name: string; img: string;}interface CartItem extends Item { quantity: number;} 위 예시에서 CartI.. 우아한 타입스크립트 with 리액트 / 3장 고급타입 (2) 타입 조합교차 타입교차 타입을 사용하면 여러 가지 타입을 결합하여 하나의 단일 타입으로 만들 수 있다.교차 타입은 &을 사용해서 표기한다. 결과물로 탄생한 교차 타입에는 타입 별칭을 붙일 수 있다.type Item = { id: number; name: string;};type Product = Item & { price: number }; 기존에 존재하는 다른 타입들을 합쳐서 해당 타입의 모든 멤버를 가지는 새로운 타입을 생성하는것이다.유니온 타입교차 타입이 A와 B를 모두 만족하는 경우라면 유니온 타입은 A 또는 B 중 하나가 될 수 있는타입을 말하며 A | B 같이 표기한다.주로 특정 변수가 가질 수 있는 타입을 전부 나열하는 용도로 사용된다. 교차 타입과 마찬가지로2개 이상의 타입을 이어 붙일.. 우아한 타입스크립트 with 리액트 / 3장 고급타입 (1) any 타입any 타입은 자바스크립트에 존재하는 모든 값을 오류 없이 받을 수 있다.타입스크립트는 동적 타이핑 특징을 가진 자바스크립트에 정적 타이핑을 적용하는 것이 주된목적이지만 any 타입은 이러한 목적을 무시하고 동적 타이핑으로 돌아가는 것과 비슷한 결과를가져온다. 따라서 any 타입을 변수에 할당하는 것은 지양행 할 패턴으로 알려져 있다.그럼에도 any 타입을 사용해야 할 때가 있는데 대표적으로 3가지 사례를 들 수 있다. 1. 개발 단계에서 임시로 값을 지정해야 할 때복잡한 구성 요소로 이루어진 개발 과정에서 추후 값이 변경될 가능성이 있거나 아직 세부항목에 대한 타입이 확정되지 않은 경우가 생길 수 있다. 이럴 때 해당 값을 any로 지정하면 경고없이 개발을 계속할 수 있어 타입을 명시하는 데.. 이전 1 다음
