TypeScriptのアノテーションで、複数の型のメンバーを組み合わせることは可能か?
2023-12-14 06:23:18
質問
私がやろうとしていることは不可能なようですが、本当にそうであってほしいのです。
本質的に、私は2つのインターフェースを持っており、私はそれらの両方の組み合わせとして単一の関数パラメータをアノテートしたいと思います。
interface ClientRequest {
userId: number
sessionKey: string
}
interface Coords {
lat: number
long: number
}
そして、関数の中で、次のようなことをしたいと思います。
function(data: ClientRequest&Coords) { ... }
私の'data'オブジェクトが両方のタイプのメンバーすべてを含むことができるようにするためです。
で参照されるものを見たのですが 仕様のプレビュー の下で参照されているものを見ましたが、これはまだ含まれていないようです。
それが可能でない場合、私の解決策は次のようになるかもしれません。
interface ClientRequest<T> {
userId: number
sessionKey: string
data?: T
}
function(data: ClientRequest<Coords>) { ... }
これは、私が望むほどダイナミックではありませんが、このケースでは動作するでしょう。私は本当に注釈自体で複数の(2つ以上の)タイプを組み合わせることができるようにしたいと思います。
function(data: TypeA&TypeB&TypeC) { ... }
従来の解決策は、これらの型を拡張する型を定義することだと思いますが、それだと柔軟性に欠けるように思います。もし型を追加したい場合は、以下のどちらかを行わなければなりません。
- (a) 宣言に戻って書き直す、または
- (b) まったく新しいインターフェイスを作成する。余分なオーバーヘッドに同意するかどうかはわかりません。
TypeScriptのエキスパートがいたら、正しい方向性を示してくれるだろうか?
どのように解決するのですか?
ご質問に対する具体的な答えは、「いいえ、複合型や拡張型を示すインライン注釈は1つもありません」です。
あなたが解決しようとしている問題のベストプラクティスは、他の2つを拡張する3番目の型を作成することでしょう。
interface IClientRequestAndCoords extends IClientRequest, ICoords {}
function(data: IClientRequestAndCoords)
アップデイト 2018-10-30
TypeScriptにタイプインターセクションが追加されました。なので、単純にできるようになりました。
interface ClientRequest {
userId: number
sessionKey: string
}
interface Coords {
lat: number
long: number
}
function log(data: ClientRequest & Coords) {
console.log(
data.userId,
data.sessionKey,
data.lat,
data.long
);
}
関連
-
[解決済み] TypeScriptでパラメータとして強く型付けされた関数は可能か?
-
[解決済み] プログラムによって、16進数の色を明るくしたり暗くしたりする(または、rgb、およびブレンドカラー)。
-
[解決済み] Typescript オブジェクトのインデックス付きメンバの型を強制する?
-
[解決済み] Typescriptで型の拡張は可能か?
-
[解決済み] TypeScriptのオブジェクトをC#のようにDictionary型にする
-
[解決済み】TypeScriptのインターフェースと型について
-
[解決済み】TypeScriptで複数の型を持つ配列を定義する
-
[解決済み] サブドメインにまたがってlocalStorageを使用する
-
[解決済み] コールバック地獄とは何か、RXはそれをどのように、そしてなぜ解決するのか?
-
[解決済み] JavaScript のオブジェクトの配列を比較し、最小値/最大値を取得する
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] 2つのJavaScriptオブジェクトのプロパティを動的にマージするにはどうすればよいですか?
-
[解決済み] JavaScript で範囲を作成する - 奇妙な構文
-
[解決済み] Angularjs - 現在の日付を表示する
-
[解決済み] 兄弟ノードを選択する方法はありますか?
-
[解決済み] CORS OriginヘッダーとCSRFトークンによるCSRF保護
-
[解決済み] javascript includes() 大文字小文字を区別しない
-
[解決済み] HTML要素にスクロールバーがあるかどうかをチェックする
-
[解決済み] jQueryのバージョン1、バージョン2、バージョン3の違いは何ですか?[クローズド]
-
[解決済み] JavaScriptの文字列プリミティブとStringオブジェクトの違いは何ですか?
-
[解決済み] JavaScriptでDIVを表示・非表示にするには?