TypeScript関数のオーバーロード

TypeScript関数のオーバーロードを使用する場合

最近、この機能について知りました.しかし、私はそれが本当に簡単に理解し、コードを簡素化を見つけるので、あなたとそれを共有したいと思います.しかし、すべての機能のように、それは独自のユースケースを持っており、時にはこの構文を使用しないでください.

TypeScript関数をオーバーロードするとき
ユーザーIDを取得するには2つの方法があります.そのIDは、その名前(文字列)、最初の名前(String)、および誕生日(datetime上のLUU)です.
ここでは、異なるパラメータを持つ同じ方法があります.
最初のアプローチは、

function getUser(idOrName: string | number, firstName?: string, birthDate?: DateTime): User {
  ...
}

しかし、私たちがこれのようにそれを使うことができたことを意味するので、それは本当に関連していません:

getUser(name, firstName);

そして、それは我々が書くと思っていたものでありません.
できるだけです.

getUser(id);
getUser(name, firstName, birthDate);

したがって、これは期待するものを実装する方法です.

getUser(id: number): User; // (1)
getUser(name: string, firstName: string, birthDate: DateTime): User; // (2)
getUser(idOrName: string | number, firstName?: string, birthDate: DateTime): User {
  if(typeof idOrName === number) {
    (1)
  } else {
    // (2)
  }
}

規則

実装はすべてのケースを処理しなければなりません.

実装シグネチャは最後でなければなりません.

TypeScript関数のオーバーロードを使用しない場合
今、名前、最初の名前、誕生日を含むインターフェイスのアイデンティティがあるとします.次のように書くことができます.

interface Identity {
  name: string;
  firstName: string;
  birthDate: DateTime;
}

getUser(id: number): User;
getUser(identity: Identity): User;
getUser(idOrIdentity: number | Identity): User {
  ...
}

しかし、それはこれをコード化する最も簡単な方法でありません.以下の通りです.

interface Identity {
  name: string;
  firstName: string;
  birthDate: DateTime;
}

getUser(idOrIdentity: number | Identity): User {
  ...
}

あなたは常にそれが可能であるときは、ユニオン型を好む必要があります.これは、タイプスクリプトの勧告であり、あなたが見ることができるように、それはより簡単です.
関数のオーバーロードは、同じパラメーター数を持たない場合に便利です.
読書ありがとう.

もっと学ぶ

How to Undo a GIT Commit

Angular for everyone: All about it