ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [Type-challenges] 난이도 Medium - (10)
    Front-End(Web)/Typescript 2023. 2. 28. 19:13
    반응형

    Github 챌린지 문제들을 풀고 관련된 내용을 정리하면서, 부족했던 타입스크립트 기본지식을 다지고자 한다. (주 1-2회)

     

    https://github.com/type-challenges/type-challenges

     

    GitHub - type-challenges/type-challenges: Collection of TypeScript type challenges with online judge

    Collection of TypeScript type challenges with online judge - GitHub - type-challenges/type-challenges: Collection of TypeScript type challenges with online judge

    github.com

     


    📘 목차 - Medium

    1. Construct Tuple
    2. Number Range
    3. Combination
    4. Subsequence
    5. FirstUniqueCharIndex

     

     

    📘 문제 및 풀이

     

    1. Construct Tuple

    Construct a tuple with a given length.

    For example
    type result = ConstructTuple<2> // expect to be [unknown, unkonwn]
    /* _____________ Test Cases _____________ */
    import type { Equal, Expect } from '@type-challenges/utils'
    
    type cases = [
      Expect<Equal<ConstructTuple<0>, []>>,
      Expect<Equal<ConstructTuple<2>, [unknown, unknown]>>,
      Expect<Equal<ConstructTuple<999>['length'], 999>>,
      // @ts-expect-error
      Expect<Equal<ConstructTuple<1000>['length'], 1000>>,
    ]

     

    🖌 풀이

    type ConstructTuple<L extends number, A extends unknown[] = []> = L extends A['length'] ? A : ConstructTuple<L, [...A, unknown]>

    제너릭 인자에 배열을 저장하여 그 길이를 L과 비교하면 쉽게 풀 수 있다.

     


    2. Number Range

    Sometimes we want to limit the range of numbers... For examples.
    type result = NumberRange<2 , 9> //  | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9
    /* _____________ Test Cases _____________ */
    import type { Equal, Expect } from '@type-challenges/utils'
    type Result1 = | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9
    type Result2 = | 0 | 1 | 2
    type Result3 =
      | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10
      | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20
      | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30
      | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40
      | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50
      | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60
      | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70
      | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80
      | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90
      | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100
      | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110
      | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120
      | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130
      | 131 | 132 | 133 | 134 | 135 | 136 | 137 | 138 | 139 | 140
    type cases = [
      Expect<Equal<NumberRange<2, 9>, Result1>>,
      Expect<Equal<NumberRange<0, 2>, Result2>>,
      Expect<Equal<NumberRange<0, 140>, Result3>>,
    ]

     

    🖌 풀이

    type AddOn<M, R extends unknown[] = []> = R['length'] extends M
      ? [...R, 1]['length']
      : AddOn<M, [...R, 1]>;
    
    type NumberRange<L, H, A extends unknown[] = []> = L extends H
      ? [...A, L][number]
      : NumberRange<AddOn<L>, H, [...A, L]>;

    좋은 풀이를 가져와봤다. AddOn은 현재 숫자의 +1을 반환하는 유틸리티다.

    위 유틸리티로 L을 1씩 올리면서 이 L값을 A배열에 누적하면서 NumberRange 유틸리티를 재귀하는 것이다.

     


    3. Combination

    Given an array of strings, do Permutation & Combination. It's also useful for the prop types like video 
    controlsList
    // expected to be `"foo" | "bar" | "baz" | "foo bar" | "foo bar baz" | "foo baz" | "foo baz bar" | "bar foo" | "bar foo baz" | "bar baz" | "bar baz foo" | "baz foo" | "baz foo bar" | "baz bar" | "baz bar foo"`
    type Keys = Combination<['foo', 'bar', 'baz']>
    /* _____________ Test Cases _____________ */
    import type { Equal, Expect } from '@type-challenges/utils'
    
    type cases = [
      Expect<Equal<Combination<['foo', 'bar', 'baz']>,
      'foo' | 'bar' | 'baz' | 'foo bar' | 'foo bar baz' | 'foo baz' | 'foo baz bar' | 'bar foo' | 'bar foo baz' | 'bar baz' | 'bar baz foo' | 'baz foo' | 'baz foo bar' | 'baz bar' | 'baz bar foo'>>,
    ]

     

    🖌 풀이

    type Combination<T extends string[], A = T[number], U = A> = 
      U extends infer I extends string
        ? I | `${I} ${Combination<[], Exclude<A, I>>}`
        :never

    이전의 AllCombination(문자열 조합) 문제와 유사할 줄 알았으나 사뭇 달랐다.

    A(T 인자들의 유니온 타입), U(A를 복사한 타입) 두 가지를 추가인자로 두고, U의 각 유니온 타입값에 대해 Combination을 재귀적으로 돌려준다. 이 때, 두 번째 인자로 원본 A에서 I를 제외한 배열을 넘겨준다.

     


    4. Subsequence

    Given an array of unique elements, return all possible subsequences.

    A subsequence is a sequence that can be derived from an array by deleting some or no elements without changing the order of the remaining elements.


    For example:

    type A = Subsequence<[1, 2]> // [] | [1] | [2] | [1, 2]
    /* _____________ Test Cases _____________ */
    import type { Equal, Expect } from '@type-challenges/utils'
    
    type cases = [
      Expect<Equal<Subsequence<[1, 2]>, [] | [1] | [2] | [1, 2]>>,
      Expect<Equal<Subsequence<[1, 2, 3]>, [] | [1] | [2] | [1, 2] | [3] | [1, 3] | [2, 3] | [1, 2, 3] >>,
    ]

     

    🖌 풀이

    type Subsequence<T extends any[]> = T extends [infer F, ...infer R] ? ([F] | [F, ...Subsequence<R>] | Subsequence<R>) : T;

    Subsequence 유틸리티를 재귀적으로 실행해준다.

    F만 있는 경우, F와 나머지를 같이 포함한 경우, 나머지만 있는 경우 3가지가 유니온된다.

     


    5. FirstUniqueCharIndex

    Given a string s, find the first non-repeating character in it and return its index. If it does not exist, return -1. 

    Only test cases.

    /* _____________ Test Cases _____________ */
    import type { Equal, Expect } from '@type-challenges/utils'
    
    type cases = [
      Expect<Equal<FirstUniqueCharIndex<'leetcode'>, 0>>,
      Expect<Equal<FirstUniqueCharIndex<'loveleetcode'>, 2>>,
      Expect<Equal<FirstUniqueCharIndex<'aabb'>, -1>>,
      Expect<Equal<FirstUniqueCharIndex<''>, -1>>,
    ]

     

    🖌 풀이

    type FirstUniqueCharIndex<T extends string, L extends string = '', I extends 0[] = []> = 
      T extends `${infer F}${infer R}`
        ? `${L}${R}` extends `${string}${F}${string}` 
           ? FirstUniqueCharIndex<R,`${L}${F}`,[...I,0]> 
           :I['length']
        : -1

    제네릭 인자로, L(이전 문자), I(인덱스를 계산하기 위한 배열) 2가지를 추가적으로 설정했다.

     

    먼저 T가 문자열일 때, L(이전 문자)과 R(현재 문자를 제외한 나머지 문자) 을 조합하고, 여기에 F(현재문자) 좌우에 string으로 확장한 문자열에 해당되는지를 확인한다.

    이에 해당된다면, F는 고유문자가 아니기 때문에, 남은 R문자, 기존 L에 F를 더한 이전문자, 인덱스 배열에 한 개 인자를 추가하여 재귀한다.

    아니라면, 지금 F는 고유문자이므로 그 인덱스 값을 I배열의 길이로 반환한다. 마지막까지 찾지 못하면 -1을 반환한다. 

    반응형
Designed by Tistory.