TypeScriptで配列リテラル、Arrayコンストラクタ、ジェネリック型など、固定長配列を宣言する5つの方法
2024-04-02
TypeScriptで固定長配列を宣言する方法
配列リテラルを使う
最も簡単な方法は、配列リテラルを使う方法です。配列リテラルは、角括弧の中にカンマで区切られた要素を並べて記述します。
const numbers: number[] = [1, 2, 3, 4, 5]; // 5要素の固定長配列
この方法では、配列の長さを明示的に指定する必要はありません。ただし、配列の長さを変更しようとすると、エラーが発生します。
Array コンストラクタを使う方法も、固定長配列を宣言するのに有効です。Array コンストラクタには、配列の長さを指定する引数が必要です。
const numbers: number[] = new Array(5); // 5要素の固定長配列
// 各要素を初期化する
for (let i = 0; i < numbers.length; i++) {
numbers[i] = i + 1;
}
この方法では、配列の長さを明示的に指定する必要があります。また、各要素を初期化する場合は、ループ処理などを記述する必要があります。
ジェネリック型を使う方法では、配列の長さを型パラメータとして指定することができます。
type FixedLengthArray<T, N extends number> = [T, ...T][N];
const numbers: FixedLengthArray<number, 5> = [1, 2, 3, 4, 5]; // 5要素の固定長配列
この方法では、配列の長さを型パラメータとして指定するため、コードの可読性と保守性を向上させることができます。
readonly 修飾子を使う方法では、配列の長さを変更できない固定長配列を宣言することができます。
const numbers: readonly number[] = [1, 2, 3, 4, 5]; // 5要素の固定長配列
// numbers.push(6); // エラーが発生する
この方法では、配列の長さを変更しようとすると、エラーが発生するため、意図しない変更を防ぐことができます。
TypeScriptで固定長配列を宣言するには、いくつかの方法があります。それぞれの方法にはメリットとデメリットがあるので、状況に応じて使い分けることが重要です。
配列リテラルを使う
const numbers: number[] = [1, 2, 3, 4, 5]; // 5要素の固定長配列
// 配列の長さを取得
console.log(numbers.length); // 5
// 配列の要素にアクセス
console.log(numbers[2]); // 3
// 配列の要素を追加しようとするとエラーが発生
numbers.push(6); // エラーが発生
Array コンストラクタを使う
const numbers: number[] = new Array(5); // 5要素の固定長配列
// 各要素を初期化する
for (let i = 0; i < numbers.length; i++) {
numbers[i] = i + 1;
}
// 配列の長さを取得
console.log(numbers.length); // 5
// 配列の要素にアクセス
console.log(numbers[2]); // 3
// 配列の要素を追加しようとするとエラーが発生
numbers.push(6); // エラーが発生
ジェネリック型を使う
type FixedLengthArray<T, N extends number> = [T, ...T][N];
const numbers: FixedLengthArray<number, 5> = [1, 2, 3, 4, 5]; // 5要素の固定長配列
// 配列の長さを取得
console.log(numbers.length); // 5
// 配列の要素にアクセス
console.log(numbers[2]); // 3
// 配列の要素を追加しようとするとエラーが発生
numbers.push(6); // エラーが発生
readonly 修飾子を使う
const numbers: readonly number[] = [1, 2, 3, 4, 5]; // 5要素の固定長配列
// 配列の長さを取得
console.log(numbers.length); // 5
// 配列の要素にアクセス
console.log(numbers[2]); // 3
// 配列の要素を追加しようとするとエラーが発生
numbers.push(6); // エラーが発生
固定長配列を宣言するその他の方法
ReadonlyArray 型は、readonly 修飾子を付けた Array 型と同じように動作します。
const numbers: ReadonlyArray<number> = [1, 2, 3, 4, 5]; // 5要素の固定長配列
// 配列の長さを取得
console.log(numbers.length); // 5
// 配列の要素にアクセス
console.log(numbers[2]); // 3
// 配列の要素を追加しようとするとエラーが発生
numbers.push(6); // エラーが発生
タプル型を使う
タプル型は、要素の型と個数を固定した配列型です。
type Numbers = [number, number, number, number, number]; // 5要素の固定長配列
const numbers: Numbers = [1, 2, 3, 4, 5];
// 配列の長さを取得
console.log(numbers.length); // 5
// 配列の要素にアクセス
console.log(numbers[2]); // 3
// 配列の要素を追加しようとするとエラーが発生
numbers.push(6); // エラーが発生
ライブラリを使う
fp-ts などのライブラリには、固定長配列を扱うための関数や型が提供されています。
import { array } from "fp-ts";
const numbers: array.ReadonlyNonEmptyArray<number> = array.range(1, 6); // 5要素の固定長配列
// 配列の長さを取得
console.log(array.length(numbers)); // 5
// 配列の要素にアクセス
console.log(array.head(numbers)); // 1
// 配列の要素を追加しようとするとエラーが発生
array.push(numbers, 6); // エラーが発生
typescript types fixed-length-array
