TypeScript 配列 多型 定義
方法 1: タプル型を使用する
タプル型は、配列の各要素の型を指定する固定長の配列です。
let myTuple: [string, number, boolean] = ["Hello", 42, true];
この例では、myTuple
は文字列、数値、ブール値の 3 つの要素を持つタプル型です。
方法 2: ジェネリック型を使用する
ジェネリック型は、型をパラメータとして受け取る型です。配列の型をジェネリック型として定義することで、複数の型を受け入れることができます。
let myGenericArray: Array<string | number> = ["Hello", 42];
この例では、myGenericArray
は文字列または数値の要素を持つ配列です。
方法 3: インターフェースを使用する
インターフェースは、オブジェクトの型を定義するものです。配列の型をインターフェースとして定義することで、複数の型を受け入れることができます。
interface MyArray {
[index: number]: string | number;
}
let myInterfaceArray: MyArray = ["Hello", 42];
注意
- ジェネリック型とインターフェースは、配列の要素の型が一致することを保証するために、型チェックが実行されます。
- ジェネリック型とインターフェースは、配列の要素の型を柔軟に定義することができます。
- タプル型は、配列の要素の型と長さを固定します。
TypeScript で配列に複数の型を定義する
タプル型を使用する
let myTuple: [string, number, boolean] = ["Hello", 42, true];
- 説明
このコードでは、タプル型を使用して配列の各要素の型を指定しています。myTuple
は文字列、数値、ブール値の 3 つの要素を持つタプル型です。
ジェネリック型を使用する
let myGenericArray: Array<string | number> = ["Hello", 42];
- 説明
このコードでは、ジェネリック型を使用して配列の要素の型を指定しています。myGenericArray
は文字列または数値の要素を持つ配列です。
インターフェースを使用する
interface MyArray {
[index: number]: string | number;
}
let myInterfaceArray: MyArray = ["Hello", 42];
ユニオン型を使用する
ユニオン型は、複数の型のうちいずれかの型を表す型です。配列の要素の型をユニオン型として定義することができます。
let myUnionArray: (string | number)[] = ["Hello", 42];
インターフェースのインデックスシグネチャを使用する
インターフェースのインデックスシグネチャは、オブジェクトのインデックスの型と値の型を指定するものです。配列の要素の型をインデックスシグネチャとして定義することができます。
interface MyArray {
[index: number]: string | number;
}
let myInterfaceArray: MyArray = ["Hello", 42];
ジェネリック型と制約を使用する
ジェネリック型に制約を指定することで、受け取ることができる型の範囲を制限することができます。配列の要素の型をジェネリック型として定義し、制約を指定することができます。
interface Numeric {
num: number;
}
function myGenericFunction<T extends Numeric>(arr: T[]): void {
// ...
}
- 説明
このコードでは、ジェネリック型T
にNumeric
インターフェースを制約として指定しています。これにより、myGenericFunction
関数はNumeric
インターフェースを実装する型の配列を受け取ることができます。
- ジェネリック型と制約は、より複雑な型定義が必要な場合に使用することができます。
- インターフェースのインデックスシグネチャは、配列の要素の型を指定する際に、最も一般的な方法です。
- これらの方法は、配列の要素の型を柔軟に定義することができます。
arrays typescript