본문 바로가기

프론트엔드/TS 공부23

타입 좁히기 - 타입 가드의 종류 최종 수정 : 2024-05-29타입 좁히기조건문 등을 이용해 타입을 상황에 따라 좁히는 방법타입 가드(Type Guard)타입 좁히기를 도와준다.특정 스코프 내에서 사용되는 타입을 런타임에 체크하는 일종의 표현이다.종류typeof, instanceof, in, 리터럴 타입 가드, 서로소 유니온 타입, 사용자 정의 타입 가드type Person = { name: string; age: number;};function func(value: number | string | Date | null | Person) { if (typeof value === 'number') { console.log(value.toFixed()); } else if (typeof value === 'string') {.. 2024. 5. 28.
타입 단언 최종 수정 : 2024-05-28타입 단언(type assertion)type Person = { name: string; age: number;};let person = {} as Person;person.name = 'yeongtaek';person.age = 33; 초과 프로퍼티가 적용되지 않을 때, 타입 단언을 사용하면 가능하다.type Dog = { name: string; color: string;};let dog = { name: '돌돌이', color: 'brown', breed: '진도',} as Dog;타입 단언의 규칙 규칙을 만족할 때 쓰는 것이 좋다. A가 B의 슈퍼타입이거나A가 B의 서브타입이어야 한다.// 가능let num1 = 10 as never;let num2 .. 2024. 5. 28.
타입 추론 최종 수정 : 2024-05-28타입 추론타입 추론이 가능한 이유는 무엇인가?타입 추론이 가능한 조건은 무엇인가?1) 변수를 선언하고 초기화해줄 때let a = 10;let b = 'hello'; 2) 구조분해 할당// 객체의 구조분해 할당let c = { id: 1, name: 'yeongtaek', profile: { nickname: 'teadyeong', }, urls: ["https://www.naver.com"],};let { id, name, profile } = c;// 배열의 구조분해 할당let [one, two, three] = [1, 'hello', true]; 3) 함수의 반환값을 지정해줄 때function func() { return 'hello';} 4) 함수의 .. 2024. 5. 28.
설치하기 최종 수정 : 2024-05-30React에 TypeScript 설치하기매번 찾아보다가 번거로워서 작성하기로 결정했다. 역시 공식문서가 짱이다.https://create-react-app.dev/docs/adding-typescript/ Adding TypeScript | Create React AppNote: this feature is available with react-scripts@2.1.0 and higher.create-react-app.dev  폴더 생성 -> VS Code로 해당 폴더 열기 -> 터미널에서 npm init -> 모두 그냥 default 값으로 설정(Enter 계속) -> npm i @types/node -> 타입스크립트 컨파일러(tsc) 설치 -> npm install t.. 2024. 5. 27.
자바스크립트의 런타임과 타입스크립트의 컴파일 최종 수정 : 2024-05-27런타임과 컴파일타임프로그래밍 언어는 일반적으로 고수준(High-level)과 저수준(low-level) 언어로 구분할 수 있다. 고수준 언어는 사람이 이해하기 쉬운 형식으로 작성되며, 저수준 언어는 컴퓨터가 이해하기 쉬운 형식으로 작성된다. 자바스크립트는 대표적인 고수준 언어에 속하며 컴파일러나 인터프리터에 의해 저수준 언어로 번역되어 실행된다. 이처럼 소스코드가 기계어 코드로 변환되어 실행이 가능한 프로그램이 되는 이 단계를 컴파일타임(compile time)이라고 부른다. 다시 말해, 컴파일타임은 소스코드가 컴파일 과정을 거쳐 컴퓨터가 인식할 수 있는 기계어 코드(바이트 코드)로 변환되어 실행할 수 있는 프로그램이 되는 과정을 의미한다. 소스코드의 컴파일이 완료되면 프.. 2024. 5. 25.

티스토리툴바