1124

LOGS

• りあクト1巻 を読み進める

  • typescript の章に入る
  • mom!.lastName のように ! のことを 非 Null アサーション演算子（Non-Null Assertion Operator） というらしい
  • 以下の型を理解できたのは自分の中では大きい．パッと見これ何ー？と毎回ググってあまり理解できていないまま終わっていたから

  const permissions = {
    r: 0b100 as const,
    w: 0b010 as const,
    x: 0b001 as const,
  };
  
  type PermChar = keyof typeof permissions;
  /*
    const permissions: {
      r: 4;
      w: 2;
      x: 1;
    }
    type PermChar = "r" | "w" | "x"
  */
  
  type PermNum = typeof permissions[PermChar];
  // type PermNum = 4 | 2 | 1
  
  type ValueOf<T> = T[keyof T];
  type PermNum = ValueOf<typeof permissions>;
  
  const species = ['rabbit', 'bear', 'fox', 'dog'] as const;
  type Species = typeof species[number];
  

  • as const を付けると、TypeScriptにおいて値が「リテラル型」として扱われるようになる

  • [keyof T] とか [K: string]: number とかを インデックス型 (index signature) と言うらしい

    • こんな感じで in を組み合わせることもできると

    type Fig = 'one' | 'two' | 'three';
    type FigMap = { [key in Fig]?: number };
    

  • typescript って T extends U ? X : Y こんなことできるのか

    • 条件付き型（Conditional Type） と呼ぶと
    • 参考例のコードがわかりやすい

    interface User { id: unknown }
    type NewUser = User & { id: string };
    type OldUser = User & { id: number };
    interface Book { isbn: string }
    
    type IdOf<T> = T extends User ? T['id'] : never;
    
    type NewUserId = IdOf<NewUser>; // string
    type OldUserId = IdOf<OldUser>; // number
    type BookId = IdOf<Book>; // never
    

    • 良くわからん infer

      • 英単語の意味は「推論する」
      • サバイバルTypeScript のユーティリティ型ReturnTypeの例からinferを知る から学ぶことにする
        • ReturnType<T> はある関数の戻り値の型を取得するユーティリティ型のこと
      • extends の右辺にのみ書けると
      • サンプルコードがむずかったが何とか理解はできた…こっちはイメージしやすい

      type Flatten<T> = T extends (infer U)[] ? U : never;
      
      // ↓↓結果
      type A = Flatten<string>;
      // type A = never
      
      type B = Flatten<string[]>;
      // type B = string
      type C = Flatten<string[][]>;
      // type C = string[]
      
      type D = Flatten<[string, number]>;
      // type D = string | number
      

      • (infer U)[] は Array<infer U> とも書ける

    • テンプレートリテラル型（Template Literal Types） って初めて知ったがこれすげぇな．便利〜

      ``typescript type DateFormat =${number}-${number}-${number}`; const date1: DateFormat = '2022-09-01'; const date2: DateFormat = 'Sep. 1, 2022'; // エラー

      interface MonthMap {

    [key: `month_${number}`]: string;
  }
  const monthMap: MonthMap = {
    month_01: 'January',
    month_02: 'Februaly',
  };

  monthMap.month_03 = 'March';
  monthMap.four = 'April'; // エラー
  ```

OTHERS