TypeScript配列宣言解説

TypeScriptでは、配列を宣言する際に型を指定することができます。これにより、コンパイル時に型チェックが行われ、実行時にエラーが発生するのを防ぐことができます。

配列の宣言方法

配列を宣言する方法は、以下のように3通りあります。

角括弧[]を使用する

let numbers: number[] = [1, 2, 3];
let strings: string[] = ["apple", "banana", "orange"];

Array<T>を使用する

let numbers: Array<number> = [1, 2, 3];
let strings: Array<string> = ["apple", "banana", "orange"];

型推論を使用する

let numbers = [1, 2, 3]; // 型はnumber[]
let strings = ["apple", "banana", "orange"]; // 型はstring[]

配列の要素へのアクセス

配列の要素にアクセスするには、インデックスを使用します。インデックスは0から始まる整数です。

let numbers: number[] = [1, 2, 3];
console.log(numbers[0]); // 1
console.log(numbers[1]); // 2
console.log(numbers[2]); // 3

配列の要素の変更

配列の要素を変更するには、インデックスを使用して新しい値を代入します。

let numbers: number[] = [1, 2, 3];
numbers[1] = 4;
console.log(numbers); // [1, 4, 3]

配列の長さの取得

配列の長さを取得するには、lengthプロパティを使用します。

let numbers: number[] = [1, 2, 3];
console.log(numbers.length); // 3

配列のメソッド

TypeScriptでは、配列に対してさまざまなメソッドを使用することができます。

• reduce(): 配列の要素を累積して1つの値を計算する
• filter(): 配列の要素から条件を満たす要素を抽出する
• map(): 配列の各要素に対して関数を適用して新しい配列を作成する
• sort(): 配列の要素をソートする
• reverse(): 配列の要素を逆順にする
• join(): 配列の要素を文字列に連結する
• splice(): 配列の特定の要素を削除または追加する
• slice(): 配列の部分配列を抽出する
• unshift(): 配列の先頭に要素を追加する
• pop(): 配列の末尾から要素を削除する

// 数値の配列
let numbers: number[] = [1, 2, 3];

// 文字列の配列
let fruits: string[] = ["apple", "banana", "orange"];

// 数値の配列
let numbers: Array<number> = [1, 2, 3];

// 文字列の配列
let fruits: Array<string> = ["apple", "banana", "orange"];

// 数値の配列
let numbers = [1, 2, 3]; // 型はnumber[]

// 文字列の配列
let fruits = ["apple", "banana", "orange"]; // 型はstring[]

let numbers: number[] = [1, 2, 3];

console.log(numbers[0]); // 1
console.log(numbers[1]); // 2
console.log(numbers[2]); // 3

let numbers: number[] = [1, 2, 3];

numbers[1] = 4;

console.log(numbers); // [1, 4, 3]

let numbers: number[] = [1, 2, 3];

console.log(numbers.length); // 3

let numbers: number[] = [1, 2, 3];

// 末尾に要素を追加
numbers.push(4);

// 末尾から要素を削除
numbers.pop();

// 先頭から要素を削除
numbers.shift();

// 先頭に要素を追加
numbers.unshift(0);

// 部分配列を抽出
let slicedNumbers = numbers.slice(1, 3);

// 特定の要素を削除または追加
numbers.splice(1, 1, 5);

// 要素を文字列に連結
let joinedString = numbers.join(", ");

// 要素を逆順にする
numbers.reverse();

// 要素をソートする
numbers.sort();

// 各要素に対して関数を適用して新しい配列を作成
let squaredNumbers = numbers.map(num => num * num);

// 条件を満たす要素を抽出
let evenNumbers = numbers.filter(num => num % 2 === 0);

// 要素を累積して1つの値を計算
let sum = numbers.reduce((acc, cur) => acc + cur, 0);

型推論の活用

TypeScriptは、変数の型を自動的に推論することができます。配列の場合も同様で、要素の型が明らかであれば、型を明示的に指定する必要はありません。

let numbers = [1, 2, 3]; // 型はnumber[]
let fruits = ["apple", "banana", "orange"]; // 型はstring[]

読みやすさのための型エイリアス

複雑な型を定義する必要がある場合、型エイリアスを使用して読みやすさを向上させることができます。

type NumberArray = number[];
type FruitArray = string[];

let numbers: NumberArray = [1, 2, 3];
let fruits: FruitArray = ["apple", "banana", "orange"];

ジェネリック型

より柔軟な配列を定義するために、ジェネリック型を使用することができます。ジェネリック型は、型パラメータを受け取り、その型に基づいて型を推論します。

function identity<T>(arg: T): T {
  return arg;
}

let numbers: number[] = identity([1, 2, 3]);
let fruits: string[] = identity(["apple", "banana", "orange"]);

readonly配列

配列の要素を変更できないようにするには、readonlyキーワードを使用します。

let readonlyNumbers: readonly number[] = [1, 2, 3];

// readonlyNumbers[0] = 4; // エラー: readonly配列の要素を変更できません

Tuple型

特定の要素数と型を持つ配列を定義するには、Tuple型を使用します。

let person: [string, number] = ["John Doe", 30];

Array.from()メソッド

既存の配列やイテラブルオブジェクトから新しい配列を作成するには、Array.from()メソッドを使用します。

let numbers = Array.from([1, 2, 3]);
let fruits = Array.from("apple");