Help us understand the problem. What is going on with this article?

TypeScript: オブジェクトリテラルはメソッドオーバーロードできない問題と解決策

TypeScriptでは、オーバーロードメソッドを定義できますが、オブジェクトリテラルにはオーバーロードメソッドを書くことができません。例えば、次のコードはbarメソッドを複数定義しようとする例ですが、コンパイルエラーになります。

// コンパイルエラーになるコードです
const Foo = {
  bar(value: number): number
  bar(value: string): string
  bar(value: any): any {
    return value
  }
}

この問題は、こちらのTypeScript Playgroundで再現できます。

:bulb: クラスでのオーバーロード: TypeScriptのオーバーロードの書き方の基本については、以前「オーバーロードメソッドを定義する方法」で説明したのでご覧ください。今回問題にするのは、クラスでのオーバーロードではなく、オブジェクトリテラルでオーバーロードのやりかたです。

オブジェクトリテラルでオーバーロードメソッドを作る方法

では、オブジェクトリテラルでオーバーロードメソッドを定義するにはどうしたらいいのでしょうか? 解決策が2つあります。ひとつずつ見ていきましょう。

解決策1: interfaceを定義する

ひとつめの解決策は、interfaceを定義する方法です。この方法では、オーバーロードメソッドの宣言はinterfaceに書き、実装はオブジェクトリテラルに書きます。

interface FooInterface {
  bar(value: number): number
  bar(value: string): string
}

const Foo: FooInterface = {
  bar(value: any): any {
    return value
  }
}

この方法では、クラスのオーバーロードの書き方と異なり、オーバーロードの定義が実装と離れてしまうことがあるものの、ハックのないストレートなコードになります。

解決策2: 匿名クラスを使う

ふたつめの解決策は、匿名クラスを使う方法です。この方法は、オーバーロードメソッドの宣言と実装は、同じ匿名クラスに書くことができます。

const Foo = new class {
  bar(value: number): number
  bar(value: string): string
  bar(value: any): any {
    return value
  }
}

匿名クラスを使うため、ハック感がいなめないコードになりますが、オーバーロードの定義と実装が一箇所で管理できるというメリットはあります。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした