전체 글46 TS 타입 챌린지 스터디 - 8 Week 8Medium-1978-PercentageParser${infer F}${infer N}${infer S} 형태로 진행하고 F, S가 각각의 Sign을 만족하는지를 판별하려 했으나해당 위치가 비어있는 경우 N에 해당하는 부분이 쪼개지는 경우가 발생type PlusMinus = "+" | "-";type PercentSign = "%";// Divide the string into prefix and resttype PrefixCheck = T extends PlusMinus ? T : never;type SuffixCheck = T extends `${infer R}${PercentSign}` ? [R, "%"] : [T, ""];type PercentageParser = P extends.. 2025. 3. 5. TS 타입 챌린지 스터디 - 7 Week 7Medium-645-Difftype Diff = Omit;O & O1을 통해 두 객체가 가진 key 값을 모두 포함할 수 있는 객체를 생성하고, 중복되는 key를 제거하는 형태O & O1은 객체간의 인터섹션으로, 객체의 인터섹션은 모든 키를 포함하는 객체를 생성한다. (동일한 key가 있다면, 해당 key의 value의 타입은 O[key]와 O1[key]가 intersection된 타입을 갖게 된다.)keyof (O | O1)은 O | O1 연산을 먼저 수행하고 keyof 연산을 수행하며,keyof 연산은 유니언 타입에 대해 실행되면, 유니언 구성원이 공통으로 갖는 키만을 반환한다.keyof O | keyof O1은 O와 O1의 키가 모두 포함된 유니언을 반환한다. (모든 key값을 얻고자 할.. 2025. 2. 22. TS 타입 챌린지 스터디 - 6 Week 6Medium-459-Flattentype Flatten = T extends [infer First, ...infer Rest] ? First extends any[] ? [...Flatten, ...Flatten] : [First, ...Flatten] : T;배열 T를 재귀적으로 평탄화하는 형태infer First를 통해 첫 요소를 추출하고, 그것이 배열이라면 spread 연산자를 통해 평탄화한다.만약 첫 요소가 배열이 아니라면 그냥 추가한다.이렇게 재귀적으로 평탄화를 진행하면 최종적으로 모든 요소가 평탄화된 배열을 얻을 수 있다.Medium-527-AppendToObjecttype AppendToObject = { [key in keyof T | U]: key extend.. 2025. 2. 13. TS 타입 챌린지 스터디 - 5 Week 5Medium-110-Capitalizetype MyCapitalize = S extends `${infer First}${infer Rest}` ? `${Uppercase}${Rest}` : S;이는 TypeScript 내장 타입 Uppercase를 사용하여 첫번째 문자를 대문자로 변환한다.내장 타입을 사용하지 않는다고 한다면, 소문자-대문자를 key-value로 갖는 interface 혹은 type을 이용하는 방법도 가능하다.Uppercase, Lowercase와 같은 내장 타입들은 타입스크립트 컴파일러 코드를 보면 JS 내장 메서드를 호출하는 것을 확인할 수 있다.// typescript github repo: src/compiler/checker.ts:13569function appl.. 2025. 2. 7. TS 타입 챌린지 스터디 - 4 TS Types - Week 4Medium-15-Last-of-Arraytype Last = T extends [...infer _, infer L] ? L : never;rest operator를 사용한다. 마지막 요소를 남기고 나머지 앞부분을 rest로 추출할 수 있다.Last of Array이지만 tuple 형태로 주어지는 경우를 함께 처리하기 위해 readonly array를 사용한다.빈 배열이어서 마지막 요소를 추출할 수 없는 경우 never를 반환한다.Medium-16-Poptype Pop = T extends [...infer F, infer _] ? F : [];rest operator 를 사용하여 마지막 요소를 제거하고 나머지 요소를 반환요소가 하나거나 없는 경우 빈 배열을 반환한다... 2025. 2. 2. TS 타입 챌린지 스터디 - 3 TS Types - Week 3Medium-2-Return-Typetype MyReturnType any> = T extends ( ...args: any[]) => infer K ? K : never;ReturnType는 함수 T의 리턴값의 타입을 반환하는 타입이다.T는 함수여야 하기에 T extends (...args: any[]) => any 를 만족해야 한다여기에 이어서 함수의 리턴 타입을 infer K로 추론하여 K를 리턴하도록 한다.이 때, 함수의 리턴 타입이 K로 타입 추론되며 언제나 반환 타입을 추론하게 되어 K를 리턴하기에false condition은 any여도 never여도 상관없다고 볼 수 있다. infer를 사용하기 위해 존재하는 형태로 볼 수 있다Medium-3-Omittyp.. 2025. 1. 27. TS 타입 챌린지 스터디 - 2 TS Types - Week 2Easy-189-Awaited최종적으로 반환되는 타입을 추출하는 타입type MyAwaited = T extends null | undefined ? T : T extends object & { then(onfulfilled: infer F, ...args: infer _): any } ? F extends (value: infer V, ...args: infer _) => any ? MyAwaited : never : T;T extends null | undefined : T가 null 또는 undefined인 경우, T를 반환합니다.T extends object & { then(onfulfilled: infer F, ...args: infer _): a.. 2025. 1. 26. TS 타입 챌린지 스터디 - 1 TS Types - Week 1[WarmUp-Hello-World]type HelloWorld = string;Easy-4-Pickin - Mapped Type 안에서 이용될 시, 객체의 키를 순회하며 새로운 타입을 정의하기 위해 이용된다.MappedTypeextends - A extends B와 같이 사용될 시, A가 B의 부분집합을 만족해야함을 의미한다.[Key in K] - K의 각 값을 순회하며 새로운 객체 타입의 key로 이용하기 위해 사용되었다.T[Key] - T라는 타입의 객체에서 Key에 해당하는 value의 타입을 지정한다. K가 extends를 통해 keyof T를 만족하므로 Key는 T 객체의 key이다.type MyPick = { [Key in K]: T[Key];};Easy-7-.. 2025. 1. 25. TeoConf 2024를 다녀오다 2024년 11월 23일 토요일, 2024년의 테오콘에 다녀왔다. 햇수로만 치자면 개발자 커리어가 시작한 지 두번째 해에 여러 컨퍼런스를 다녀왔다.5월의 리액트 컨퍼런스부터 시작하여 feconf, 토스 슬래시와 같이 대규모 컨퍼런스도 있었고 AUSGCON, 오쏘콘과 같은 행사에도 다녀올 기회가 있었다. 처음의 리액트 컨퍼런스부터 느꼈던 네트워킹에 대한 아쉬움이 이번 테오콘에서는 많이 덜했다.물론 리액트 컨퍼런스에서는 식사 자리나 파티 자리에서 이야기를 할 수는 있었으나 언어의 장벽이 아직 많이 높았다. 시작부터 네트워킹을 고려하여 구성된 좌석배치와 조 구성, 네트워킹을 위한 전용 대화 주제와 시간 등이 있었기에 테오콘은 일부러 나서지 않더라도 자연스럽게 대화를 할 수 있었다. 프론트엔드 개발이라는 큰 공.. 2024. 11. 26. 이전 1 2 3 4 5 6 다음
