![[TypeScript] TypeScript 공부일지: 타입 좁히기 [6/7 study]](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2Fb75jP6%2FbtsHZR0OeAe%2FAAAAAAAAAAAAAAAAAAAAAPStqdPJ77uNsfJBYE6N9219TW3l4z-syjg_ArqDqgeT%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1761922799%26allow_ip%3D%26allow_referer%3D%26signature%3DJJbFSgdTPxajlB4Ks85gC0zfbHQ%253D)
TypeScript 공부일지: 타입 좁히기 ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️타입 좁히기 조건문 등을 이용해 넓은타입에서 좁은타입으로 타입을 상황에 따라 좁히는 방법을 이야기 /** * 타입 좁히기 * 조건문 등을 이용해 넓은타입에서 좁은타입으로 * 타입을 상황에 따라 좁히는 방법을 이야기 */// value => number : toFixed// value => string : toUpperCasefunction func(value: number | string) { // 마치 아래의 조건문이 number타입 값 이외에는 중괄호 내부로 들어갈 수 없도록 가드한다고해서 // TS에서는 타입 가드(Type Guard)라고 부름 if (typeof v..
![[TypeScript] TypeScript 공부일지: 타입 단언 [6/7 study]](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2FpFcbc%2FbtsHZVoBOvl%2FAAAAAAAAAAAAAAAAAAAAACVBpIzJ3S_6kEeWtVJRMhS--YFrVFVtFAvuxiGlj5Ay%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1761922799%26allow_ip%3D%26allow_referer%3D%26signature%3DjjaPq%252FV5k6YveAtRoj5F5o0SQ5A%253D)
TypeScript 공부일지: 타입 단언 ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️타입 단언/** * 타입 단언 */type Person = { name: string; age: number;};// 아래와 같이하면 Person 타입이 지금 초기화 값인 빈 객체를 기준 값으로 추론되어 버리기 때문에// person 변수의 타입이 그냥 빈 객체로 추론되어 버림// 그래서 name 과 age 프로퍼티가 없다는 경고가 나옴// let person = {};// person.name = "이정환";// person.age = 27;// 이렇게 우리 의도와 다르게 변수의 타입이 추론 되어버리기 때문에// 원하는 기능을 만들기 어려울때는 초기화 값의 타입을 단언 해주면 ..
![[TypeScript] TypeScript 공부일지: 타입 추론 [6/7 study]](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2Fb04JkL%2FbtsHZ64tKHg%2FAAAAAAAAAAAAAAAAAAAAADLyGs82Mhb-xxLdpDGI7P18xLUTEf57E138bHlKPSze%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1761922799%26allow_ip%3D%26allow_referer%3D%26signature%3D96ePuCLzKlOI5IqagCrMGsKccuE%253D)
TypeScript 공부일지: 타입 추론 ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️타입 추론이란? - 변수의 초기값을 가지고 타입 추론을 한다. - 함수의 반환값 타입을 추론할 때는 초기화하는 값이 아니라 리턴문 다음에 오는 반환값을 가지고 추론한다. - 만약에 매개변수에 기본값이 설정되어 있다면 기본값이 설정된 매개변수의 타입도 기본값을 기준으로 타입을 추론한다. - 딱봐도 우리가 봐도 타입이 추론되면 당연히 TS도 타입 추론 똑같이 함 /** * 타입 추론 * - 변수의 초기값을 가지고 타입 추론을 한다. * - 함수의 반환값 타입을 추론할 때는 초기화하는 값이 아니라 리턴문 다음에 오는 반환값을 가지고 추론한다. * - 만약에 매개변수에 기본값이 설정되어 있..
![[TypeScript] TypeScript 공부일지: 대수 타입 [6/7 study]](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2FEQtpe%2FbtsHZcLdIm6%2FAAAAAAAAAAAAAAAAAAAAAFI0m6SnrR0vOrLUlclILwmWHIzVBUJ0UMEmqz4bE3_n%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1761922799%26allow_ip%3D%26allow_referer%3D%26signature%3D2SuwkaBhw8CiP2jf%252FeuW%252Bh4Wu54%253D)
TypeScript 공부일지: 대수 타입 ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️대수 타입이란?- 여러개의 타입을 합성해서 새롭게 만들어낸 타입 - 합집합, 교집합 타입이 존재함 /** * 1. 합집합 타입(Union 타입) */let a: string | number | boolean;a = "hello";a = 1;a = true;let arr: (number | string | boolean)[] = [1, "hello", true];type Dog = { name: string; color: string;};type Person = { name: string; language: string;};type Union1 = Dog | Person;let..
![[TypeScript] TypeScript 공부일지: 타입 호환성 예시 [6/4 study]](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2FbTs4Sa%2FbtsHYHLJ9XI%2FAAAAAAAAAAAAAAAAAAAAAHzP_l1p4ELsNskD_6qYvM5iKlxLhdK_1RtARBVO5piQ%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1761922799%26allow_ip%3D%26allow_referer%3D%26signature%3DES66p63Q0iRQtvYMWopnjbg7tsI%253D)
TypeScript 공부일지: 타입 호환성 예시 ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️타입 호환성 예시// 객체 타입의 호환성/** * 기본타입간의 호환성 */let num1: number = 10;let num2: 10 = 10;num1 = num2;/** * 객체 타입간의 호환성 * -> 어떤 객체타입을 다른 객체타입으로 취급해도 괜찮은가? */type Animal = { name: string; color: string;};type Dog = { name: string; color: string; breed: string;};let animal: Animal = { name: "기린", color: "yellow",};let dog: Dog ..
![[TypeScript] TypeScript 공부일지: 계층도 살피기 [6/4 study]](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2FdlH4V8%2FbtsHYWolPvu%2FAAAAAAAAAAAAAAAAAAAAAHs6pxoiaTAxQnc8gE5jStjk_0_WZ0Nv3Whl1h4y5wuq%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1761922799%26allow_ip%3D%26allow_referer%3D%26signature%3DHyNbHcRsmkytyegtbQAyxDbFDM8%253D)
TypeScript 공부일지: 계층도 살피기 ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️계층도 살피기/** * Unknown 타입 - 모든 */function unknownExam() { let a: unknown = 1; // Up Cast로 가능, 반대로 Down Cast는 불가능 let b: unknown = "hello"; let c: unknown = true; let d: unknown = null; let e: unknown = undefined; let unknownVar: unknown; // let num: number = unknownVar; // let str: string = unknownVar; // let bool: bool..
![[TypeScript] TypeScript 공부일지: 타입 호환성 [6/4 study]](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2FbnyP6s%2FbtsH0zEXrle%2FAAAAAAAAAAAAAAAAAAAAAAzEymfJWsH9wtLsV2EgNYR4DMfmX4mDdDecXn_og3He%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1761922799%26allow_ip%3D%26allow_referer%3D%26signature%3DYe6fdaaThaw%252ByoSzofq%252BYN5ridQ%253D)
TypeScript 공부일지: 타입 호환성 ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음❗️타입 호환성// 타입은 집합이다// 타입호환성 - 어떤 타입을 다른 타입으로 취급해도 괜찮은지 판단하는 것// ex) number type --->(x) number literal type// number type
![[TypeScript] TypeScript 공부일지: void, never [6/4 study]](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2FbeeXK6%2FbtsHZYrXVtk%2FAAAAAAAAAAAAAAAAAAAAAOock9VpAWr7A47qNrMCleiZFteQ2oJ8cDKM9d6y5Bem%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1761922799%26allow_ip%3D%26allow_referer%3D%26signature%3Dnn65zrSBHpdg9PTw5oqpns6n%252BYo%253D)
TypeScript 공부일지: void, never ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음❗️voidvoid -> 공허 -> 아무것도 없다.void -> 아무것도 없음을 의미하는 타입// 리턴값 타입 지정 가능function func1(): string { return "hello";}function func2() { console.log("hello");}let a: void;// a = 1;// a = "hello";a = undefined; ❗️nevernever -> 존재하지 않는불가능한 타입// while (true) {}
![[TypeScript] TypeScript 공부일지: any, unknown [6/4 study]](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2FF9NmA%2FbtsHZg02QdC%2FAAAAAAAAAAAAAAAAAAAAALDDbNMb38BqhQiiUCmq0AkdKaK1tGCcdLfMjWKPHlqP%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1761922799%26allow_ip%3D%26allow_referer%3D%26signature%3DlPyMAxLEsHW4%252FOW3yHKmMIxvd2M%253D)
TypeScript 공부일지: any, unknown ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음❗️any특정 변수의 타입을 우리가 확실히 모를때 사용let anyVar: any = 10;anyVar = "hello";JS처럼 타입 상관없이 아무 값이나 담게 하려면 any type 사용anyVar = true;anyVar = {};anyVar = () => {};anyVar.toUpperCase();anyVar.toFixed();let num: number = 10;num = anyVar; ❗️unknownlet unknownVar: unknown;unknownVar = "";unknownVar = 1;unknownVar = () => {};num = unknownVa..