0
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【typescript】こんな型定義あったんだまとめ

Last updated at Posted at 2024-04-13

1. 概要

typescriptの型定義に疎く、あまり融通が効かないイメージを勝手に持っていたのですが、調べてみたら意外と色々と出来ることをしりました。その中から、個人的に面白いと思ったものをまとめてみます。

2. 内容

2-1. 模倣リテラル型 (Template Literal Types

型を参照した型定義を行い、正規表現っぽい定義を行うことができます。

type.ts
// suffixとしてnumberを付与することができる
type HogeId = `hoge_${number}`;

${number}には自分で定義した型も格納できるので、色々使い勝手が良さそう。

2-2. 条件付き型 (Conditional Types

条件付き型として、定義した型に合致する場合とそうでない場合の処理を定義することができる。

type.ts
// 格納された変数がstringか否かの判定をしてくれる
type IsString<T> = T extends string ? ture : false;

// プロパティがstringだったら除去する
type NonFunctionPropertyNames<T> = {
   [K in keyof T]: T[K] extends String ? never : K;
}[keyof T];

生のjavascriptで書かれた外部モジュールを使用するけど、型安全に書きたい時などに便利そう?

2-3. 部分型と必須型

type.ts
// 部分一致を許容する
type Original = {
   a: string,
   b: number,
   c: boolean
};

type PartialOriginal =  Partial<Original>
// 以下と同じ定義になる
// {
//    a?: string;
//    b?: number;
//    c?: boolean;
//}


type Original = {
   a?: string,
   b: number,
   c?: boolean
};

const RequiredOriginal = Required<Original>

// 以下と同じ定義になる
// {
//    a: string;
//    b: number;
//    c: boolean;
//}

2-4. 抽出型と排除型

type.ts
// T型とU型に一致する型を抽出する
type T = 'a' | 'b' | 'c';
type U = 'a' | 'd' | 'e';

type Result = Extract<T, U>;
// 'a'のみ許容される


// T型からU型を排除した型を抽出する
type T = 'a' | 'b' | 'c';
type U = 'a' | 'd' | 'e';

type Result = Exclude<T, U>;
// 'b' | 'c'が許容される

stringやnumberなどの型と組み合わせるよりも、例で示したようにユニオン型と一緒に使う場面が多そう。

2-5. Generics

事前に型を確定させず、パラメータとして扱うことができる。

type.ts
// 引数としてどの型の変数でも受け取ることができる
// だが、引数の型と同じ型の戻り値を返すことを保証する
const identity = <T,>(arg: T): T => {
  return arg;
};

使い所は分からなかったのですが、面白かったので紹介だけ。

3. 参考

0
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?