0Pricing
TypeScript Academy · レッスン

型付き配列: T[] と Array<T>

配列に型を付け、互換性のない値の混在を防ぎます。

「型付き配列: T[] と Array<T>」はCoddyKit上の無料TypeScript Academyレッスンです。 これはレッスン1/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはTypeScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 TypeScript Academyコースには全4レッスンが含まれています。

ようこそ

TypeScriptでは、特定の型の値だけを格納できるように配列を型付けできます。このレッスンでは、2つの構文形式とその使い分けを扱います。

T[]構文

配列を型付けする最も一般的な方法は、要素の型に[]を付けることです。これは短縮構文と呼ばれます。
const numbers: number[] = [1, 2, 3];
const names: string[] = ['Alice', 'Bob'];
const flags: boolean[] = [true, false, true];

Array<T>ジェネリック構文

ジェネリック構文のArrayはT[]と同等です。ほかのジェネリック型との一貫性を保つために、こちらを好むチームもあります。
const scores: Array<number> = [95, 87, 73];
const tags: Array<string> = ['typescript', 'beginner'];

配列での型エラー

誤った型の値を追加しようとすると、TypeScriptがエラーを報告します。これにより、異なる型が混在する配列によるバグを防げます。
const ids: number[] = [1, 2, 3];
// ids.push('four'); // Error: Argument of type 'string' is not assignable to 'number'

配列型の推論

値を使って配列を初期化すると、TypeScriptは要素の型を推論します。空の配列は`never[]`と推論されるため、必ず型注釈を付けてください。
const nums = [1, 2, 3];    // inferred: number[]
const mixed = [1, 'hi'];   // inferred: (string | number)[]
const empty: string[] = []; // must annotate

オブジェクトの配列

要素の型としてinterfaceまたはtypeエイリアスを使用すると、オブジェクトの配列を型付けできます。
interface User { id: number; name: string; }
const users: User[] = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
];

一般的な配列メソッドも型付けされる

TypeScriptは組み込みの配列メソッドを理解します。map、filter、findはいずれも、適切に型付けされた結果を返します。
const nums: number[] = [1, 2, 3, 4];
const doubled: number[] = nums.map(n => n * 2);
const evens: number[] = nums.filter(n => n % 2 === 0);

ネストした配列

配列型の構文をネストすると、2次元配列を型付けできます。
const matrix: number[][] = [
  [1, 2, 3],
  [4, 5, 6],
];

ユニオン型の配列

配列で複数の型を許可するには、要素の型としてユニオン型を使用します。
const mixed: (string | number)[] = ['Alice', 1, 'Bob', 2];

型付き配列の分割代入

配列を分割代入すると、TypeScriptは分割代入された変数の型を推論します。
const coords: number[] = [10, 20];
const [x, y] = coords; // x: number, y: number

T[]とArray<T>の選択

どちらの形式もTypeScriptでは同一です。単純な型にはT[]を使用します。要素の型が長い場合や、ほかのジェネリック型と組み合わせて見やすくしたい場合はArrayを使用します。

クイックチェック

`const list = []`として宣言した空の配列について、TypeScriptは何を推論しますか？

まとめ

TypeScriptで配列を型付けするには、T[]またはArrayを使用します。空の配列には必ず型注釈を付けてください。TypeScriptは、push、map、filterなどの配列操作で要素の型を適用します。

よくある質問

「型付き配列: T[] と Array<T>」レッスンは無料ですか？

はい。「型付き配列: T[] と Array<T>」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、TypeScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 TypeScript Academyコースには全4レッスンが含まれています。

「型付き配列: T[] と Array<T>」で何を学びますか？

配列に型を付け、互換性のない値の混在を防ぎます。 ブラウザで直接実行するハンズオンコードでTypeScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

TypeScript Academyを始めるのに経験は必要ですか？

事前経験は必要ありません。CoddyKitのTypeScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン1/4です。

「型付き配列: T[] と Array<T>」レッスンにはどのくらい時間がかかりますか？

ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。

このTypeScript Academyレッスンでコードを書いて実行できますか？

はい。すべてのTypeScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。

このコースのすべてのレッスン

  1. 型付き配列: T[] と Array
  2. Readonly 配列と不変データ
  3. タプル: 固定長の型付き配列
  4. 列挙型：数値定数と文字列定数
← TypeScript Academyに戻る