TypeScript で型を使用する方法を初心者向けに解説

TypeScript は JavaScript に静的型付けを導入し、開発中にエラーを検出してコードの品質を向上させるのに役立ちます。この記事では、TypeScript での型の使用の基本について説明します。これにより、初心者が TypeScript の型システムを活用する方法を理解しやすくなります。

TypeScript の型とは何ですか?

TypeScript の型は、データの形状と構造を定義するのに役立ちます。型を指定することにより、変数、関数のパラメータ、戻り値が期待される形式に準拠していることが保証されます。これにより、多くの一般的なプログラミングエラーを防ぐことができます。

基本タイプ

TypeScript には、変数や関数を定義するために使用できるいくつかの基本的な型が用意されています。

数値: 数値を表します。
文字列: テキストデータを表します。
ブール値: true または false の値を表します。
配列: 特定の型の値のコレクションを表します。
オブジェクト: キーと値のペアのコレクションを表します。

数値例

let age: number = 30;

文字列の例

let name: string = "John Doe";

ブール値の例

let isStudent: boolean = true;

配列の例

let scores: number[] = [85, 90, 78];

オブジェクトの例

let person: { name: string, age: number } = {
  name: "Jane Doe",
  age: 28
};

型推論

TypeScript は、割り当てられた値に基づいて型を自動的に推測できます。つまり、型を明示的に指定する必要は必ずしもありませんが、明示的に指定するとコードの明確さが向上します。

型推論の例

let count = 10; // TypeScript infers count as number
count = "text"; // Error: Type 'string' is not assignable to type 'number'

インターフェースを持つカスタム型

TypeScript のインターフェースを使用すると、特定の構造を持つカスタム型を定義できます。複雑なオブジェクトを作成したり、アプリケーション全体で形状の一貫性を確保したりする場合に特に便利です。

インターフェースの例

interface Person {
  name: string;
  age: number;
}

let employee: Person = {
  name: "Alice",
  age: 32
};

ユニオン型

ユニオン型を使用すると、変数に複数の型の値を保持できます。これは、値が複数の型のいずれかになる可能性がある場合に便利です。

ユニオン型の例

let id: number | string;
id = 123; // valid
id = "abc"; // valid
id = true; // Error: Type 'boolean' is not assignable to type 'number | string'

型エイリアス

型エイリアスを使用すると、型に新しい名前を作成できます。これは、複雑な型定義を簡素化するのに役立ちます。

型エイリアスの例

type ID = number | string;

let userId: ID;
userId = 456; // valid
userId = "xyz"; // valid

結論

TypeScript で型を使用すると、エラーの早期検出、コードの可読性の向上、保守性の向上など、さまざまな利点が得られます。基本的な型、型推論、インターフェース、ユニオン型、型エイリアスを理解することで、TypeScript を活用して、より堅牢で信頼性の高いコードを作成できます。TypeScript の経験を積むにつれて、開発プロセスをさらに強化できる、より高度な機能やパターンを発見できるようになります。

typescript 型数値文字列ブール値配列オブジェクト推論インターフェースカスタムユニオンエイリアスコード